<template>
    <div class="edit-add-detail">
        <div v-loading="detailLoading" class="form-content" element-loading-text="加载中...">
            <div class="page-form">
                <!-- 主要内容区域 -->
                <div class="main-content">
                    <!-- 左侧菜单 -->
                    <div v-show="menuItems.length > 0" class="sidebar-menu">
                        <div class="menu-section">
                            <el-divider content-position="center">
                                <div class="menu-title">供应商信息</div>
                            </el-divider>
                            <div class="menu-items">
                                <div
                                    v-for="item in menuItems"
                                    :key="item.id"
                                    :class="{ active: activeMenuItem === item.id }"
                                    class="menu-item"
                                    @click="scrollToSection(item.id)"
                                >
                                    <span>{{ item.title }}</span>
                                    <el-icon :class="getSaveStatusClass(item.id)">
                                        <CircleCheck v-if="getSaveStatus(item.id)" />
                                        <CircleCheck v-else />
                                    </el-icon>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- 右侧内容区域 -->
                    <div class="content-area">
                        <el-form
                            ref="addEditFormRef"
                            :model="addEditForm"
                            :rules="addEditFormRules"
                            label-position="left"
                            label-suffix="："
                            size="large"
                        >
                            <el-collapse v-model="activeCollapse">
                                <!-- 准入申请信息 -->
                                <div
                                    v-if="hasMenuItem('access-application')"
                                    id="access-application"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">准入申请信息</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('accessApplication', '0')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="access-application">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>供应商申请</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        企业名称
                                                    </template>
                                                    <el-form-item prop="enterpriseName">
                                                        <el-select
                                                            v-model="addEditForm.enterpriseId"
                                                            :loading="supplierLoading"
                                                            :remote-method="remoteSearchSupplier"
                                                            clearable
                                                            filterable
                                                            placeholder="请输入"
                                                            remote
                                                            @change="changeEnterpr"
                                                        >
                                                            <el-option
                                                                v-for="item in enterpriseList"
                                                                :key="item.orgId"
                                                                :label="item.companyName"
                                                                :value="item.orgId"
                                                            >
                                                            </el-option>
                                                        </el-select>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        申请人
                                                    </template>
                                                    <el-form-item prop="referrer">
                                                        <el-input
                                                            v-model="addEditForm.referrer"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        申请单位
                                                    </template>
                                                    <el-form-item prop="recommendedDepartment">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.recommendedDepartment
                                                            "
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        申请时间
                                                    </template>
                                                    <el-form-item prop="applyDate">
                                                        <el-date-picker
                                                            v-model="addEditForm.applyDate"
                                                            placeholder="请选择"
                                                            type="datetime"
                                                            value-format="YYYY-MM-DD HH:mm:ss"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        拟供应物资类型
                                                    </template>
                                                    <el-form-item prop="gategoryNames">
                                                        <el-input
                                                            v-model="addEditForm.gategoryNames"
                                                            :readonly="true"
                                                            placeholder="请选择"
                                                            @click="materialChange()"
                                                        >
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 基本情况 -->
                                <div
                                    v-if="hasMenuItem('basic-info')"
                                    id="basic-info"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">基本情况</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('basicInfo', '1')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="basic-info">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>供应商基本情况表</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        供应商名称
                                                    </template>
                                                    <el-form-item prop="information.enterpriseName">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .enterpriseName
                                                            "
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        >
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 企业性质</template>
                                                    <el-form-item prop="enterprise.ownerType">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.enterprise.ownerType
                                                            "
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        >
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 注册资金</template>
                                                    <el-form-item
                                                        prop="enterprise.registeredCapital"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.enterprise
                                                                    .registeredCapital
                                                            "
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        >
                                                            <template #append>万元（RMB）</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 法定代表人</template>
                                                    <el-form-item prop="enterprise.companyEbe">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.enterprise.companyEbe
                                                            "
                                                            clearable
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 成立年份</template>
                                                    <el-form-item prop="enterprise.companyRegdate">
                                                        <el-date-picker
                                                            v-model="
                                                                addEditForm.enterprise
                                                                    .companyRegdate
                                                            "
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 开户银行</template>
                                                    <el-form-item prop="enterprise.openingBank">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.enterprise.openingBank
                                                            "
                                                            clearable
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 企业邮箱</template>
                                                    <el-form-item prop="enterprise.mail">
                                                        <el-input
                                                            v-model="addEditForm.enterprise.mail"
                                                            clearable
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 账号</template>
                                                    <el-form-item prop="enterprise.bank">
                                                        <el-input
                                                            v-model="addEditForm.enterprise.bank"
                                                            clearable
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 税号</template>
                                                    <el-form-item prop="enterprise.companyOrgcode">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.enterprise
                                                                    .companyOrgcode
                                                            "
                                                            clearable
                                                            disabled
                                                            placeholder="根据供应商选择自动填写"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 生产地址</template>
                                                    <el-form-item
                                                        prop="information.productionAddress"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .productionAddress
                                                            "
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 公司网址</template>
                                                    <el-form-item prop="information.companyWebsite">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .companyWebsite
                                                            "
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 人员信息 -->
                                <div
                                    v-if="hasMenuItem('personnel-info')"
                                    id="personnel-info"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">人员信息</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('personnelInfo', '12')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="personnel-info">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>企业高管人员</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.accessPersonnelMap
                                                        .additionalProperties1
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="姓名">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="联系方式">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.phone"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="性别">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.sex"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="出生日期">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.birthday"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="学历">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.educationBackground"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="职位">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.post"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addPersonnelInfo('1')"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deletePersonnelInfo($index, '1')
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="personnel-info">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>业务联系人</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.accessPersonnelMap
                                                        .additionalProperties2
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="姓名">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="联系方式">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.phone"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="性别">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.sex"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="出生日期">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.birthday"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="学历">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.educationBackground"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="职位">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.post"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addPersonnelInfo('2')"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deletePersonnelInfo($index, '2')
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="personnel-info">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>质量联系人</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.accessPersonnelMap
                                                        .additionalProperties3
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="姓名">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="联系方式">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.phone"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="性别">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.sex"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="出生日期">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.birthday"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="学历">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.educationBackground"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="职位">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.post"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addPersonnelInfo('3')"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deletePersonnelInfo($index, '3')
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 企业规模 -->
                                <div
                                    v-if="hasMenuItem('other-notes')"
                                    id="other-notes"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">企业规模</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('otherNotes', '2')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="other-notes">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>企业规模表</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        固定资产
                                                    </template>
                                                    <el-form-item prop="information.fixedAssets">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information.fixedAssets
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>万元（RMB）</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        上年销售额
                                                    </template>
                                                    <el-form-item prop="information.lastYearSales">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .lastYearSales
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>万元（RMB）</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        主营产品上年度销量
                                                    </template>
                                                    <el-form-item
                                                        prop="information.mainProductsLastYearSales"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .mainProductsLastYearSales
                                                            "
                                                            clearable
                                                            placeholder="请输入"
                                                            type="number"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        主营产品上年度销量额
                                                    </template>
                                                    <el-form-item
                                                        prop="information.mainProductsLastYearSalesRevenue"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .mainProductsLastYearSalesRevenue
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>万元（RMB）</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        员工人数
                                                    </template>
                                                    <el-form-item
                                                        prop="information.employeesNumber"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .employeesNumber
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>人</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 生产作业人员</template>
                                                    <el-form-item
                                                        prop="information.productionOperators"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .productionOperators
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>人</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 技术工程师</template>
                                                    <el-form-item
                                                        prop="information.technicalEngineer"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .technicalEngineer
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>人</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item>
                                                    <template #label> 质量管理人员</template>
                                                    <el-form-item
                                                        prop="information.qualityManagementPersonnel"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.information
                                                                    .qualityManagementPersonnel
                                                            "
                                                            placeholder="请输入"
                                                            type="number"
                                                        >
                                                            <template #append>人</template>
                                                        </el-input>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 企业资质 -->
                                <div
                                    v-if="hasMenuItem('qualification')"
                                    id="qualification"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">企业资质</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('qualification', '3')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="qualification">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>必填资质</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.qualificationMap
                                                        .additionalProperties1
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质类型"
                                                    width="140"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <el-select
                                                            v-model="row.qualificationCategoryCode"
                                                            placeholder="请选择"
                                                            @change="
                                                                qualificationChange(
                                                                    $event,
                                                                    $index,
                                                                    '1',
                                                                    row
                                                                )
                                                            "
                                                        >
                                                            <el-option
                                                                v-for="item in qualificationList1"
                                                                :key="
                                                                    item.qualificationCategoryCode
                                                                "
                                                                :label="
                                                                    item.qualificationCategoryName
                                                                "
                                                                :value="
                                                                    item.qualificationCategoryCode
                                                                "
                                                            />
                                                        </el-select>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质编码"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.code"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质名称"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质所属权"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-select
                                                            v-model="row.qualificationAttribution"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        >
                                                            <el-option
                                                                v-for="item in getDictionaryByCode(
                                                                    'zr-zzss'
                                                                )"
                                                                :key="item.value"
                                                                :label="item.name"
                                                                :value="item.value"
                                                            />
                                                        </el-select>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="有效开始期"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-date-picker
                                                            v-model="row.issueDate"
                                                            :disabled="!row.disabled"
                                                            placeholder="根据资质类型选择自动填写"
                                                            style="width: 100%"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="有效截止期"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-date-picker
                                                            v-model="row.validUntil"
                                                            :disabled="!row.disabled"
                                                            placeholder="根据资质类型选择自动填写"
                                                            style="width: 100%"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </template>
                                                </el-table-column>
                                                <el-table-column
                                                    align="center"
                                                    label="附件"
                                                    width="200"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.qualificationMap
                                                                    .additionalProperties1[$index]
                                                                    .files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(
                                                                        data,
                                                                        '1',
                                                                        $index
                                                                    )
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </template>
                                                </el-table-column>
                                                <el-table-column
                                                    align="center"
                                                    fixed="right"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addQualification('1')"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteQualification($index, '1')
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="qualification">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>选填资质</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.qualificationMap
                                                        .additionalProperties2
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质类型"
                                                    width="140"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <el-select
                                                            v-model="row.qualificationCategoryCode"
                                                            placeholder="请选择"
                                                            @change="
                                                                qualificationChange(
                                                                    $event,
                                                                    $index,
                                                                    '2',
                                                                    row
                                                                )
                                                            "
                                                        >
                                                            <el-option
                                                                v-for="item in qualificationList2"
                                                                :key="
                                                                    item.qualificationCategoryCode
                                                                "
                                                                :label="
                                                                    item.qualificationCategoryName
                                                                "
                                                                :value="
                                                                    item.qualificationCategoryCode
                                                                "
                                                            />
                                                        </el-select>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质编码"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.code"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质名称"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质所属权"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-select
                                                            v-model="row.qualificationAttribution"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        >
                                                            <el-option
                                                                v-for="item in getDictionaryByCode(
                                                                    'zr-zzss'
                                                                )"
                                                                :key="item.value"
                                                                :label="item.name"
                                                                :value="item.value"
                                                            />
                                                        </el-select>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="有效开始期"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-date-picker
                                                            v-model="row.issueDate"
                                                            :disabled="!row.disabled"
                                                            placeholder="根据资质类型选择自动填写"
                                                            style="width: 100%"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="有效截止期"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-date-picker
                                                            v-model="row.validUntil"
                                                            :disabled="!row.disabled"
                                                            placeholder="根据资质类型选择自动填写"
                                                            style="width: 100%"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </template>
                                                </el-table-column>
                                                <el-table-column
                                                    align="center"
                                                    label="附件"
                                                    width="200"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.qualificationMap
                                                                    .additionalProperties2[$index]
                                                                    .files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(
                                                                        data,
                                                                        '2',
                                                                        $index
                                                                    )
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </template>
                                                </el-table-column>
                                                <el-table-column
                                                    align="center"
                                                    fixed="right"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addQualification('2')"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteQualification($index, '2')
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="qualification">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>其他资质</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.qualificationMap
                                                        .additionalProperties3
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质类型"
                                                    width="140"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <el-select
                                                            v-model="row.qualificationCategoryCode"
                                                            placeholder="请选择"
                                                            @change="
                                                                qualificationChange(
                                                                    $event,
                                                                    $index,
                                                                    '3',
                                                                    row
                                                                )
                                                            "
                                                        >
                                                            <el-option
                                                                v-for="item in qualificationList3"
                                                                :key="
                                                                    item.qualificationCategoryCode
                                                                "
                                                                :label="
                                                                    item.qualificationCategoryName
                                                                "
                                                                :value="
                                                                    item.qualificationCategoryCode
                                                                "
                                                            />
                                                        </el-select>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质编码"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.code"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质名称"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="资质所属权"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-select
                                                            v-model="row.qualificationAttribution"
                                                            :disabled="!row.disabled"
                                                            clearable
                                                            placeholder="根据资质类型选择自动填写"
                                                        >
                                                            <el-option
                                                                v-for="item in getDictionaryByCode(
                                                                    'zr-zzss'
                                                                )"
                                                                :key="item.value"
                                                                :label="item.name"
                                                                :value="item.value"
                                                            />
                                                        </el-select>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="有效开始期"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-date-picker
                                                            v-model="row.issueDate"
                                                            :disabled="!row.disabled"
                                                            placeholder="根据资质类型选择自动填写"
                                                            style="width: 100%"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="有效截止期"
                                                    width="140"
                                                >
                                                    <template #default="{ row }">
                                                        <el-date-picker
                                                            v-model="row.validUntil"
                                                            :disabled="!row.disabled"
                                                            placeholder="根据资质类型选择自动填写"
                                                            style="width: 100%"
                                                            type="date"
                                                            value-format="YYYY-MM-DD"
                                                        />
                                                    </template>
                                                </el-table-column>
                                                <el-table-column
                                                    align="center"
                                                    label="附件"
                                                    width="200"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.qualificationMap
                                                                    .additionalProperties3[$index]
                                                                    .files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(
                                                                        data,
                                                                        '3',
                                                                        $index
                                                                    )
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </template>
                                                </el-table-column>
                                                <el-table-column
                                                    align="center"
                                                    fixed="right"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addQualification('3')"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteQualification($index, '3')
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 主营产品情况及质量业绩 -->
                                <div
                                    v-if="hasMenuItem('products-quality')"
                                    id="products-quality"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">
                                            主营产品情况及质量业绩表
                                        </div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('productsQuality', '4')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="products-quality">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>主营产品生产销售情况</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.mainProductsPerformance
                                                        .salesStatus2List
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="产品种类">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.productCategory"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="规格">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.specifications"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="近三年年产量"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="
                                                                row.pastThreeYearsAnnualProduction
                                                            "
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="交货周期">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.deliveryCycle"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="主要客户及市场"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.mainCustomersMarkets"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addProductsQuality()"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteProductsQuality($index)
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="products-quality">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>主营产品质量表现</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.mainProductsPerformance
                                                        .qualityPerformance2List
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="产品名称及规格"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.productName"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="去年质量目标"
                                                >
                                                    <el-table-column align="center" label="指标">
                                                        <template #default="{ row }">
                                                            <el-input
                                                                v-model="
                                                                    row.lastYearQualityTargetIndexValue
                                                                "
                                                                clearable
                                                                placeholder="请输入"
                                                            />
                                                        </template>
                                                    </el-table-column>

                                                    <el-table-column align="center" label="实际值">
                                                        <template #default="{ row }">
                                                            <el-input
                                                                v-model="
                                                                    row.lastYearQualityTargetActualValue
                                                                "
                                                                clearable
                                                                placeholder="请输入"
                                                            />
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="今年质量目标"
                                                >
                                                    <el-table-column align="center" label="指标">
                                                        <template #default="{ row }">
                                                            <el-input
                                                                v-model="
                                                                    row.thisYearQualityTargetIndexValue
                                                                "
                                                                clearable
                                                                placeholder="请输入"
                                                            />
                                                        </template>
                                                    </el-table-column>

                                                    <el-table-column align="center" label="实际值">
                                                        <template #default="{ row }">
                                                            <el-input
                                                                v-model="
                                                                    row.thisYearQualityTargetActualValue
                                                                "
                                                                clearable
                                                                placeholder="请输入"
                                                            />
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addQualityPerformance()"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteQualityPerformance($index)
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        拟提供我司产品
                                                    </template>
                                                    <el-form-item
                                                        prop="mainProductsPerformance.proposedProductOffering"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.mainProductsPerformance
                                                                    .proposedProductOffering
                                                            "
                                                            :rows="4"
                                                            clearable
                                                            maxlength="200"
                                                            placeholder="请输入"
                                                            show-word-limit
                                                            type="textarea"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        企业业绩
                                                    </template>
                                                    <el-form-item
                                                        prop="mainProductsPerformance.businessPerformance"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.mainProductsPerformance
                                                                    .businessPerformance
                                                            "
                                                            :rows="4"
                                                            clearable
                                                            maxlength="200"
                                                            placeholder="请输入"
                                                            show-word-limit
                                                            type="textarea"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 附件</template>
                                                    <el-form-item
                                                        prop="mainProductsPerformance.files"
                                                    >
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.mainProductsPerformance
                                                                    .files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            type="button"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(data, '4')
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="products-quality">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>客户抱怨</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.mainProductsPerformance
                                                        .customerComplaints2List
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="客户抱怨问题"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.customerComplaints"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="控制措施">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.controlMeasures"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addCustomerComplaints()"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteCustomerComplaints($index)
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 主要原材料及供应商表 -->
                                <div
                                    v-if="hasMenuItem('raw-materials')"
                                    id="raw-materials"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">主要原材料及供应商表</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('rawMaterials', '5')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="raw-materials">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>主要原材料信息</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="addEditForm.rawMaterialsSuppliersList"
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="主要原料名称"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.mainRawMaterialName"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="供应厂家">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.supplier"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="上年度业绩表现"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.previousYearPerformance"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="addMaterialsAndSuppliers()"
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteMaterialsAndSuppliers(
                                                                        $index
                                                                    )
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 生产制造过程绩效 -->
                                <div
                                    v-if="hasMenuItem('manufacturing')"
                                    id="manufacturing"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">生产制造过程绩效表</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('manufacturing', '6')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="manufacturing">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>生产制造过程绩效</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item :span="2">
                                                    <template #label>
                                                        <span class="required-asterisk">*</span>
                                                        生产工艺流程(可附页说明)
                                                    </template>
                                                    <el-form-item
                                                        prop="processPerformance.suproductionProcess"
                                                    >
                                                        <el-input
                                                            v-model="
                                                                addEditForm.processPerformance
                                                                    .suproductionProcess
                                                            "
                                                            :rows="4"
                                                            clearable
                                                            maxlength="200"
                                                            placeholder="请输入"
                                                            show-word-limit
                                                            type="textarea"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 附件</template>
                                                    <el-form-item prop="b">
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.processPerformance.files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            type="button"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(data, '5')
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                            <el-table
                                                :data="
                                                    addEditForm.processPerformance.processFlow2List
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="关键&重要过程"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.keyImportantProcess"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="控制参数或特性"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="
                                                                row.controlParametersCharacteristics
                                                            "
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="过程能力指数"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.processCapabilityIndex"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="
                                                                    addManufacturingPerformance()
                                                                "
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteManufacturingPerformance(
                                                                        $index
                                                                    )
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 生产及检验设备 -->
                                <div
                                    v-if="hasMenuItem('equipment')"
                                    id="equipment"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">生产及检验设备表</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('equipment', '7')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="equipment">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>主要生产设备(可附页)</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.inspectionEquipmentMap
                                                        .additionalProperties1
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="生产设备名称/型号"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="产能">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.capacity"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="数量">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.num"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="生产厂家">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.manufacturer"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="使用年限">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.serviceLife"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="
                                                                    addMainProductionEquipment()
                                                                "
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteMainProductionEquipment(
                                                                        $index
                                                                    )
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                        </div>
                                    </el-collapse-item>
                                    <el-collapse-item name="equipment">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>主要检验设备(可附页)</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-table
                                                :data="
                                                    addEditForm.inspectionEquipmentMap
                                                        .additionalProperties2
                                                "
                                                border
                                                stripe
                                            >
                                                <el-table-column
                                                    align="center"
                                                    label="序号"
                                                    width="60"
                                                >
                                                    <template #default="{ $index }">
                                                        {{ $index + 1 }}
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="生产设备名称/型号"
                                                >
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.name"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="产能">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.capacity"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="数量">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.num"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="生产厂家">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.manufacturer"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column align="center" label="使用年限">
                                                    <template #default="{ row }">
                                                        <el-input
                                                            v-model="row.serviceLife"
                                                            clearable
                                                            placeholder="请输入"
                                                        />
                                                    </template>
                                                </el-table-column>

                                                <el-table-column
                                                    align="center"
                                                    label="操作"
                                                    width="120"
                                                >
                                                    <template #default="{ row, $index }">
                                                        <div class="operation-buttons">
                                                            <el-link
                                                                :underline="false"
                                                                type="primary"
                                                                @click="
                                                                    addMainInspectionEquipment()
                                                                "
                                                            >
                                                                添加
                                                            </el-link>
                                                            <el-link
                                                                :underline="false"
                                                                type="danger"
                                                                @click="
                                                                    deleteMainInspectionEquipment(
                                                                        $index
                                                                    )
                                                                "
                                                            >
                                                                删除
                                                            </el-link>
                                                        </div>
                                                    </template>
                                                </el-table-column>
                                            </el-table>
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 附件</template>
                                                    <el-form-item prop="b">
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.inspectionEquipmentMap
                                                                    .files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            type="button"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(data, '6')
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                        </div>
                                    </el-collapse-item>
                                </div>

                                <!-- 其他特别说明 -->
                                <div
                                    v-if="hasMenuItem('company-scale')"
                                    id="company-scale"
                                    class="content-section"
                                >
                                    <div class="content-title">
                                        <div class="content-title-left">特别说明</div>
                                        <div class="content-title-right">
                                            <el-button
                                                type="primary"
                                                @click="handleSave('companyScale', '8')"
                                                >保存
                                            </el-button>
                                        </div>
                                    </div>
                                    <el-collapse-item name="company-scale">
                                        <template #title>
                                            <div class="section-title">
                                                <el-icon>
                                                    <Document />
                                                </el-icon>
                                                <span>附件说明</span>
                                            </div>
                                        </template>
                                        <div class="section-content">
                                            <el-descriptions :column="2" border>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 特别说明</template>
                                                    <el-form-item prop="otherSpecialNotes.notes">
                                                        <el-input
                                                            v-model="
                                                                addEditForm.otherSpecialNotes.notes
                                                            "
                                                            :rows="4"
                                                            clearable
                                                            placeholder="请输入"
                                                            type="textarea"
                                                        />
                                                    </el-form-item>
                                                </el-descriptions-item>
                                                <el-descriptions-item :span="2">
                                                    <template #label> 附件</template>
                                                    <el-form-item prop="scaleFiles">
                                                        <CustomUploader
                                                            :fileList="
                                                                addEditForm.otherSpecialNotes.files
                                                            "
                                                            :previewAndDownload="false"
                                                            :typeRegularArr="typeRegularArr"
                                                            type="button"
                                                            @change="
                                                                (data) =>
                                                                    handleFileChange(data, '7')
                                                            "
                                                        >
                                                        </CustomUploader>
                                                    </el-form-item>
                                                </el-descriptions-item>
                                            </el-descriptions>
                                        </div>
                                    </el-collapse-item>
                                </div>
                            </el-collapse>
                        </el-form>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer">
            <el-button :loading="submitLoading" type="primary" @click="handleSubmit"
                >提 交
            </el-button>
            <el-button @click="handleCancel"> 取 消</el-button>
        </div>

        <!-- 物资分类 -->
        <materialsDialog
            ref="dialogRef"
            v-model:isShowAdd="materialIsShowDialog"
            title="物资分类"
            :selectedContent="materialSelectedContent"
            @submit="materialSelectedChange"
        ></materialsDialog>
    </div>
</template>

<script lang="ts" setup>
import moment from 'moment'
import { getDictionaryByCode } from '@/utils/dictionary'
import type { FormInstance, FormRules } from 'element-plus'
import { CircleCheck, Document } from '@element-plus/icons-vue'
import CustomUploader from '@/components/CustomUploader/index.vue'
import {
    dataAudit,
    dataDetail,
    dataSubmit,
    dataSubmitOtherInfo,
    getFillingProgress,
    getOwnerEnterprise,
    getQualificationType,
    getSupplier
} from '@/api/supplierMonitor/AccessManagement/AccessApplication'
import materialsDialog from '@/views/SupplierMonitor/ConfigManagement/AccessQualificationConfig/materialsDialog.vue'

interface AddEditForm {
    [key: string]: string | number | undefined | null | any
}

interface FileItem {
    id?: string
    fileId?: string
    status: string

    [key: string]: any
}

const route = useRoute()
const router = useRouter()

// UI状态
// 折叠面板激活状态 - 只包含存在的菜单项
const activeCollapse = computed(() => {
    return menuItems.value.map((item) => item.id)
})
const activeMenuItem = ref('access-application') // 当前激活的菜单项
const detailLoading = ref(false) // 详情加载状态

// 表单相关
const addEditFormRef = ref<FormInstance>()
const addEditFormRules = reactive<FormRules>({
    //准入申请
    // enterpriseName: [{ required: true, message: '请输入企业名称', trigger: 'blur' }],
    referrer: [{ required: true, message: '请输入推荐人', trigger: 'blur' }],
    recommendedDepartment: [{ required: true, message: '请输入推荐单位', trigger: 'blur' }],
    applyDate: [{ required: true, message: '请选择申请时间', trigger: 'change' }],
    gategoryNames: [{ required: true, message: '请选择拟供应物资', trigger: 'change' }],

    //基本情况
    'information.enterpriseName': [
        { required: true, message: '请输入供应商名称', trigger: 'blur' }
    ],
    // 'enterprise.ownerType': [{ required: true, message: '请输入企业性质', trigger: 'blur' }],
    // 'enterprise.registeredCapital': [
    //     { required: true, message: '请输入注册资金', trigger: 'blur' }
    // ],
    // 'enterprise.companyEbe': [{ required: true, message: '请输入法定代表人', trigger: 'blur' }],
    // 'enterprise.companyRegdate': [{ required: true, message: '请选择成立年份', trigger: 'change' }],
    // 'enterprise.openingBank': [{ required: true, message: '请输入开户银行', trigger: 'blur' }],
    // 'enterprise.bank': [{ required: true, message: '请输入账号', trigger: 'blur' }],
    // 'enterprise.companyOrgcode': [{ required: true, message: '请输入税号', trigger: 'blur' }],
    // 'enterprise.companyContact': [{ required: true, message: '请输入业务联系人', trigger: 'blur' }],
    // 'enterprise.contactTel': [{ required: true, message: '请输入电话', trigger: 'blur' }],
    // 'information.qualityContactPerson': [
    //     { required: true, message: '请输入质量联系人', trigger: 'blur' }
    // ],
    // 'information.qualityContactPersonPhone': [
    //     { required: true, message: '请输入电话', trigger: 'blur' }
    // ],

    // 企业规模
    'information.fixedAssets': [{ required: true, message: '请输入固定资产', trigger: 'blur' }],
    'information.lastYearSales': [{ required: true, message: '请输入上年销售额', trigger: 'blur' }],
    'information.mainProductsLastYearSales': [
        { required: true, message: '请输入主营产品上年度销量', trigger: 'blur' }
    ],
    'information.mainProductsLastYearSalesRevenue': [
        {
            required: true,
            message: '请输入主营产品上年度销量额',
            trigger: 'blur'
        }
    ],
    'information.employeesNumber': [{ required: true, message: '请输入员工人数', trigger: 'blur' }],

    // 主营产品情况及质量业绩
    'mainProductsPerformance.proposedProductOffering': [
        {
            required: true,
            message: '请输入拟提供我司产品',
            trigger: 'blur'
        }
    ],
    'mainProductsPerformance.businessPerformance': [
        {
            required: true,
            message: '请输入企业业绩',
            trigger: 'blur'
        }
    ],

    //生产制造过程绩效
    'processPerformance.suproductionProcess': [
        {
            required: true,
            message: '请输入生产工艺流程(可附页说明)',
            trigger: 'blur'
        }
    ]
})
const addEditForm = reactive<AddEditForm>({
    applyDate: moment().format('YYYY-MM-DD HH:mm:ss'),
    information: {},
    enterprise: {},
    accessPersonnelMap: {
        additionalProperties1: [
            {
                name: '',
                phone: '',
                gender: '',
                birthday: '',
                education: '',
                position: ''
            }
        ],
        additionalProperties2: [
            {
                name: '',
                phone: '',
                gender: '',
                birthday: '',
                education: '',
                position: ''
            }
        ],
        additionalProperties3: [
            {
                name: '',
                phone: '',
                gender: '',
                birthday: '',
                education: '',
                position: ''
            }
        ]
    },
    qualificationMap: {
        additionalProperties1: [
            {
                qualificationCategoryName: '',
                code: '',
                name: '',
                qualificationAttribution: '',
                issueDate: '',
                validUntil: '',
                files: []
            }
        ],
        additionalProperties2: [
            {
                qualificationCategoryName: '',
                code: '',
                name: '',
                qualificationAttribution: '',
                issueDate: '',
                validUntil: '',
                files: []
            }
        ],
        additionalProperties3: [
            {
                qualificationCategoryName: '',
                code: '',
                name: '',
                qualificationAttribution: '',
                issueDate: '',
                validUntil: '',
                files: []
            }
        ]
    },
    mainProductsPerformance: {
        salesStatus2List: [
            {
                productCategory: '',
                specifications: '',
                pastThreeYearsAnnualProduction: '',
                deliveryCycle: '',
                mainCustomersMarkets: ''
            }
        ],
        qualityPerformance2List: [
            {
                productName: '',
                lastYearQualityTargetIndexValue: '',
                lastYearQualityTargetActualValue: '',
                thisYearQualityTargetIndexValue: '',
                thisYearQualityTargetActualValue: ''
            }
        ],
        customerComplaints2List: [
            {
                customerComplaints: '',
                controlMeasures: ''
            }
        ],
        files: []
    },
    rawMaterialsSuppliersList: [
        {
            mainRawMaterialName: '',
            supplier: '',
            previousYearPerformance: ''
        }
    ],
    processPerformance: {
        files: [],
        processFlow2List: [
            {
                keyImportantProcess: '',
                controlParametersCharacteristics: '',
                processCapabilityIndex: ''
            }
        ]
    },
    inspectionEquipmentMap: {
        files: [],
        additionalProperties1: [
            {
                name: '',
                capacity: '',
                num: '',
                manufacturer: '',
                serviceLife: ''
            }
        ],
        additionalProperties2: [
            {
                name: '',
                capacity: '',
                num: '',
                manufacturer: '',
                serviceLife: ''
            }
        ]
    },
    otherSpecialNotes: {
        files: []
    }
})

// 检查菜单项是否存在的辅助函数
const hasMenuItem = (menuId: string) => {
    return menuItems.value.some((item) => item.id === menuId)
}

// 菜单配置数据
const menuItems = ref([])

// 保存状态数据
const saveStatus = reactive({})

// 导航相关
const scrollToSection = (sectionId: string) => {
    // 设置滚动标志，防止滚动监听干扰
    isScrolling = true

    // 更新激活的菜单项
    activeMenuItem.value = sectionId

    const element = document.getElementById(sectionId)
    if (element) {
        element.scrollIntoView({
            behavior: 'smooth',
            block: 'start'
        })

        // 滚动完成后重置标志
        setTimeout(() => {
            isScrolling = false
        }, 1000)
    } else {
        isScrolling = false
    }
}

// 滚动监听相关
let scrollContainer: HTMLElement | null = null
let isScrolling = false

// 监听滚动事件，更新激活的菜单项
const handleScroll = () => {
    if (isScrolling) return

    const sections = menuItems.value
        .map((item) => ({
            id: item.id,
            element: document.getElementById(item.id)
        }))
        .filter((section) => section.element)

    if (sections.length === 0) return

    // 获取滚动容器的滚动位置
    const scrollTop = scrollContainer?.scrollTop || window.pageYOffset
    const containerHeight = scrollContainer?.clientHeight || window.innerHeight
    const scrollHeight = scrollContainer?.scrollHeight || document.documentElement.scrollHeight

    // 检查是否滚动到底部（距离底部100px以内）
    const isNearBottom = scrollTop + containerHeight >= scrollHeight - 100

    // 如果接近底部，直接选中最后一个section
    if (isNearBottom) {
        const lastSection = sections[sections.length - 1]
        if (lastSection && activeMenuItem.value !== lastSection.id) {
            activeMenuItem.value = lastSection.id
        }
        return
    }

    // 找到当前可见的section
    let currentSection = sections[0]

    for (const section of sections) {
        if (!section.element) continue

        const rect = section.element.getBoundingClientRect()
        const elementTop = rect.top + scrollTop
        const elementBottom = elementTop + rect.height

        // 如果section的顶部在视口范围内
        if (elementTop <= scrollTop + containerHeight / 2 && elementBottom > scrollTop) {
            currentSection = section
        }
    }

    // 更新激活的菜单项
    if (currentSection && activeMenuItem.value !== currentSection.id) {
        activeMenuItem.value = currentSection.id
    }
}

// 防抖处理滚动事件
const debouncedHandleScroll = () => {
    if (isScrolling) return
    requestAnimationFrame(() => {
        handleScroll()
    })
}

// 数据获取
const getDetail = async (id: string) => {
    // 获取详情逻辑
    detailLoading.value = true
    const { ...rest } = (await dataDetail(id)) as AddEditForm
    Object.assign(addEditForm, {
        ...rest
    })
    if (addEditForm.information.enterprise) {
        addEditForm.enterprise = addEditForm.information.enterprise
    }
    addEditForm.gategoryNames = addEditForm.materialCategory2List
        .map((item: any) => item.categoryName)
        .join(',')
    materialSelectedContent.value = addEditForm.materialCategory2List

    addEditForm.qualificationMap.additionalProperties1 = addEditForm.qualificationMap[1] || [{}]
    addEditForm.qualificationMap.additionalProperties2 = addEditForm.qualificationMap[2] || [{}]
    addEditForm.qualificationMap.additionalProperties3 = addEditForm.qualificationMap[3] || [{}]

    addEditForm.rawMaterialsSuppliersList =
        addEditForm.rawMaterialsSuppliersList.length > 0
            ? addEditForm.rawMaterialsSuppliersList
            : [{}]

    addEditForm.inspectionEquipmentMap.additionalProperties1 = addEditForm
        .inspectionEquipmentMap[1] || [{}]
    addEditForm.inspectionEquipmentMap.additionalProperties2 = addEditForm
        .inspectionEquipmentMap[2] || [{}]

    if (addEditForm.enterpriseName) {
        await remoteSearchSupplier(addEditForm.enterpriseName)
    }

    addEditForm.accessPersonnelMap.additionalProperties1 = addEditForm.accessPersonnelMap[1] || [{}]
    addEditForm.accessPersonnelMap.additionalProperties2 = addEditForm.accessPersonnelMap[2] || [{}]
    addEditForm.accessPersonnelMap.additionalProperties3 = addEditForm.accessPersonnelMap[3] || [{}]

    await getEnterpriseList()
    detailLoading.value = false
}

//人员信息
const addPersonnelInfo = (type: string) => {
    addEditForm.accessPersonnelMap[`additionalProperties${type}`].push({
        name: '',
        phone: '',
        sex: '',
        birthday: '',
        educationBackground: '',
        post: ''
    })
}
const deletePersonnelInfo = (index: number, type: string) => {
    ElMessageBox.confirm('确定要删除这条人员信息吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            if (type === '1') {
                addEditForm.accessPersonnelMap.additionalProperties1.splice(index, 1)
            } else if (type === '2') {
                addEditForm.accessPersonnelMap.additionalProperties2.splice(index, 1)
            } else {
                addEditForm.accessPersonnelMap.additionalProperties3.splice(index, 1)
            }
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

// 企业资质相关方法
const addQualification = (type: string) => {
    if (type === '1') {
        addEditForm.qualificationMap.additionalProperties1.push({
            disabled: true,
            qualificationCategoryName: '',
            code: '',
            name: '',
            qualificationAttribution: '',
            issueDate: '',
            validUntil: '',
            files: []
        })
    } else if (type === '2') {
        addEditForm.qualificationMap.additionalProperties2.push({
            disabled: true,
            qualificationCategoryName: '',
            code: '',
            name: '',
            qualificationAttribution: '',
            issueDate: '',
            validUntil: '',
            files: []
        })
    } else {
        addEditForm.qualificationMap.additionalProperties3.push({
            disabled: true,
            qualificationCategoryName: '',
            code: '',
            name: '',
            qualificationAttribution: '',
            issueDate: '',
            validUntil: '',
            files: []
        })
    }
}

const deleteQualification = (index: number, type: string) => {
    ElMessageBox.confirm('确定要删除这条资质信息吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            if (type === '1') {
                addEditForm.qualificationMap.additionalProperties1.splice(index, 1)
            } else if (type === '2') {
                addEditForm.qualificationMap.additionalProperties2.splice(index, 1)
            } else {
                addEditForm.qualificationMap.additionalProperties3.splice(index, 1)
            }
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//主营产品生产销售情况
const addProductsQuality = () => {
    addEditForm.mainProductsPerformance.salesStatus2List.push({
        productCategory: '',
        specifications: '',
        pastThreeYearsAnnualProduction: '',
        deliveryCycle: '',
        mainCustomersMarkets: ''
    })
}

const deleteProductsQuality = (index: number) => {
    ElMessageBox.confirm('确定要删除这条主营产品生产销售情况吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.mainProductsPerformance.salesStatus2List.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//主营产品质量表现
const addQualityPerformance = () => {
    addEditForm.mainProductsPerformance.qualityPerformance2List.push({
        productName: '',
        lastYearQualityTargetIndexValue: '',
        lastYearQualityTargetActualValue: '',
        thisYearQualityTargetIndexValue: '',
        thisYearQualityTargetActualValue: ''
    })
}

const deleteQualityPerformance = (index: number) => {
    ElMessageBox.confirm('确定要删除这条主营产品质量表现吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.mainProductsPerformance.qualityPerformance2List.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//客户抱怨
const addCustomerComplaints = () => {
    addEditForm.mainProductsPerformance.customerComplaints2List.push({
        customerComplaints: '',
        controlMeasures: ''
    })
}

const deleteCustomerComplaints = (index: number) => {
    ElMessageBox.confirm('确定要删除这条客户抱怨吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.mainProductsPerformance.customerComplaints2List.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//主要原材料信息
const addMaterialsAndSuppliers = () => {
    addEditForm.rawMaterialsSuppliersList.push({
        mainRawMaterialName: '',
        supplier: '',
        previousYearPerformance: ''
    })
}

const deleteMaterialsAndSuppliers = (index: number) => {
    ElMessageBox.confirm('确定要删除这条主要原材料信息吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.rawMaterialsSuppliersList.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//生产制造过程绩效
const addManufacturingPerformance = () => {
    addEditForm.processPerformance.processFlow2List.push({
        keyImportantProcess: '',
        controlParametersCharacteristics: '',
        processCapabilityIndex: ''
    })
}

const deleteManufacturingPerformance = (index: number) => {
    ElMessageBox.confirm('确定要删除这条生产制造过程绩效吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.processPerformance.processFlow2List.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//主要生产设备
const addMainProductionEquipment = () => {
    addEditForm.inspectionEquipmentMap.additionalProperties1.push({
        name: '',
        capacity: '',
        num: '',
        manufacturer: '',
        serviceLife: ''
    })
}

const deleteMainProductionEquipment = (index: number) => {
    ElMessageBox.confirm('确定要删除这条主要生产设备吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.inspectionEquipmentMap.additionalProperties1.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//主要检验设备
const addMainInspectionEquipment = () => {
    addEditForm.inspectionEquipmentMap.additionalProperties2.push({
        name: '',
        capacity: '',
        num: '',
        manufacturer: '',
        serviceLife: ''
    })
}

const deleteMainInspectionEquipment = (index: number) => {
    ElMessageBox.confirm('确定要删除这条主要检验设备吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            addEditForm.inspectionEquipmentMap.additionalProperties2.splice(index, 1)
            ElMessage.success('删除成功')
        })
        .catch(() => {})
}

//附件上传
const typeRegularArr = [
    'mp4',
    'mov',
    'avi',
    'mkv',
    'wmv',
    'flv',
    'mpeg',
    'mpg',
    '3gp',
    'webm', // 视频格式
    'doc',
    'docx',
    'xls',
    'xlsx',
    'ppt',
    'pptx',
    'txt',
    'rtf',
    'pdf', // 文档格式
    'jpg',
    'png',
    'bmp',
    'gif' // 图像文件
]

const handleFileChange = (file: [FileItem], type: string, index: number) => {
    let fileList = file.map((item) => item as FileItem)
    if (type === '1') {
        addEditForm.qualificationMap.additionalProperties1[index].files = fileList
    } else if (type === '2') {
        addEditForm.qualificationMap.additionalProperties2[index].files = fileList
    } else if (type === '3') {
        addEditForm.qualificationMap.additionalProperties3[index].files = fileList
    } else if (type === '4') {
        addEditForm.mainProductsPerformance.files = fileList
    } else if (type === '5') {
        addEditForm.processPerformance.files = fileList
    } else if (type === '6') {
        addEditForm.inspectionEquipmentMap.files = fileList
    } else if (type === '7') {
        addEditForm.otherSpecialNotes.files = fileList
    }
}

// 表单操作
const blockFields = {
    // 准入申请
    accessApplication: [
        'enterpriseName',
        'referrer',
        'recommendedDepartment',
        'applyDate',
        'gategoryNames'
    ],
    // 基本情况
    basicInfo: [
        // 'information.enterpriseName',
        // 'information.qualityContactPerson',
        // 'information.qualityContactPersonPhone'
    ],
    // 人员信息
    personnelInfo: [],
    // 企业规模
    otherNotes: [
        'information.fixedAssets',
        'information.lastYearSales',
        'information.mainProductsLastYearSales',
        'information.mainProductsLastYearSalesRevenue',
        'information.employeesNumber'
    ],
    // 企业资质表
    qualification: [],
    // 主营产品情况及质量业绩
    productsQuality: [
        'mainProductsPerformance.proposedProductOffering',
        'mainProductsPerformance.businessPerformance'
    ],
    // 主要原材料及供应商
    rawMaterials: [],
    // 生产制造过程绩效
    manufacturing: ['processPerformance.suproductionProcess'],
    // 生产及检验设备
    equipment: [],
    // 其他特别说明
    companyScale: []
}

// 保存
const removeEmptyObjectsByKey = (array, key) => {
    return array.filter((item) => {
        const value = item[key]
        return value !== '' && value !== null && value !== undefined
    })
}

const handleSave = async (blockKey: string, moduleCode: string) => {
    const fields = blockFields[blockKey]
    if (!fields) {
        console.error(`未找到块 ${blockKey} 的字段配置`)
        return
    }

    try {
        // 只校验当前块的字段
        if (fields.length > 0) {
            await addEditFormRef.value.validateField(fields)
        }

        // 校验通过，提取当前块的数据进行保存
        const blockData = {}
        fields.forEach((field) => {
            blockData[field] = addEditForm[field]
        })

        // 调用保存接口
        await saveBlockData(blockKey, blockData, moduleCode)
    } catch (error) {
        console.log(`${getBlockName(blockKey)}校验失败`)
    }
}

// 保存数据到后端
const saveBlockData = async (blockKey, data, moduleCode) => {
    try {
        detailLoading.value = true
        let param = JSON.parse(JSON.stringify(addEditForm))
        if (blockKey === 'basicInfo' || blockKey === 'accessApplication') {
            param.information.enterprise = param.enterprise
        }
        if (blockKey !== 'accessApplication') {
            param.moduleCode = moduleCode
        }

        if (blockKey === 'qualification') {
            param.qualificationMap.additionalProperties1 = removeEmptyObjectsByKey(
                param.qualificationMap.additionalProperties1,
                'qualificationCategoryName'
            )
            param.qualificationMap.additionalProperties2 = removeEmptyObjectsByKey(
                param.qualificationMap.additionalProperties2,
                'qualificationCategoryName'
            )
            param.qualificationMap.additionalProperties3 = removeEmptyObjectsByKey(
                param.qualificationMap.additionalProperties3,
                'qualificationCategoryName'
            )
            if (param.qualificationMap.additionalProperties1.length > 0) {
                param.qualificationMap.additionalProperties1 =
                    param.qualificationMap.additionalProperties1.map((item) => {
                        return {
                            ...item,
                            mustTransmit: 1
                        }
                    })
            }
            if (param.qualificationMap.additionalProperties2.length > 0) {
                param.qualificationMap.additionalProperties2 =
                    param.qualificationMap.additionalProperties2.map((item) => {
                        return {
                            ...item,
                            mustTransmit: 2
                        }
                    })
            }
            if (param.qualificationMap.additionalProperties3.length > 0) {
                param.qualificationMap.additionalProperties3 =
                    param.qualificationMap.additionalProperties3.map((item) => {
                        return {
                            ...item,
                            mustTransmit: 3
                        }
                    })
            }
        }

        if (blockKey === 'productsQuality') {
            param.mainProductsPerformance.salesStatus2List = removeEmptyObjectsByKey(
                param.mainProductsPerformance.salesStatus2List,
                'productCategory'
            )
            param.mainProductsPerformance.qualityPerformance2List = removeEmptyObjectsByKey(
                param.mainProductsPerformance.qualityPerformance2List,
                'productName'
            )
            param.mainProductsPerformance.customerComplaints2List = removeEmptyObjectsByKey(
                param.mainProductsPerformance.customerComplaints2List,
                'customerComplaints'
            )
        }

        if (blockKey === 'rawMaterials') {
            param.rawMaterialsSuppliersList = removeEmptyObjectsByKey(
                param.rawMaterialsSuppliersList,
                'mainRawMaterialName'
            )
        }

        if (blockKey === 'manufacturing') {
            param.processPerformance.processFlow2List = removeEmptyObjectsByKey(
                param.processPerformance.processFlow2List,
                'keyImportantProcess'
            )
        }

        if (blockKey === 'equipment') {
            param.inspectionEquipmentMap.additionalProperties1 = removeEmptyObjectsByKey(
                param.inspectionEquipmentMap.additionalProperties1,
                'name'
            )
            param.inspectionEquipmentMap.additionalProperties2 = removeEmptyObjectsByKey(
                param.inspectionEquipmentMap.additionalProperties2,
                'name'
            )
            if (param.inspectionEquipmentMap.additionalProperties1.length > 0) {
                param.inspectionEquipmentMap.additionalProperties1 =
                    param.inspectionEquipmentMap.additionalProperties1.map((item) => {
                        return {
                            ...item,
                            deviceType: 1
                        }
                    })
            }

            if (param.inspectionEquipmentMap.additionalProperties2.length > 0) {
                param.inspectionEquipmentMap.additionalProperties2 =
                    param.inspectionEquipmentMap.additionalProperties2.map((item) => {
                        return {
                            ...item,
                            deviceType: 2
                        }
                    })
            }
        }

        if (blockKey === 'personnelInfo') {
            param.accessPersonnelMap.additionalProperties1 = removeEmptyObjectsByKey(
                param.accessPersonnelMap.additionalProperties1,
                'name'
            )
            if (param.accessPersonnelMap.additionalProperties1.length > 0) {
                param.accessPersonnelMap.additionalProperties1 =
                    param.accessPersonnelMap.additionalProperties1.map((item) => {
                        return {
                            ...item,
                            type: 'topManager'
                        }
                    })
            }
            param.accessPersonnelMap.additionalProperties2 = removeEmptyObjectsByKey(
                param.accessPersonnelMap.additionalProperties2,
                'name'
            )
            if (param.accessPersonnelMap.additionalProperties2.length > 0) {
                param.accessPersonnelMap.additionalProperties2 =
                    param.accessPersonnelMap.additionalProperties2.map((item) => {
                        return {
                            ...item,
                            type: 'businessPerson'
                        }
                    })
            }
            param.accessPersonnelMap.additionalProperties3 = removeEmptyObjectsByKey(
                param.accessPersonnelMap.additionalProperties3,
                'name'
            )
            if (param.accessPersonnelMap.additionalProperties3.length > 0) {
                param.accessPersonnelMap.additionalProperties3 =
                    param.accessPersonnelMap.additionalProperties3.map((item) => {
                        return {
                            ...item,
                            type: 'qualityPerson'
                        }
                    })
            }
        }

        const { state, value } =
            blockKey === 'accessApplication'
                ? await dataSubmit(param)
                : await dataSubmitOtherInfo(param)
        if (state) {
            addEditForm.id = value.id
            if (blockKey === 'basicInfo' || blockKey === 'otherNotes') {
                addEditForm.information.id = value.information.id
            } else if (blockKey === 'productsQuality') {
                addEditForm.mainProductsPerformance.id = value.mainProductsPerformance.id
            } else if (blockKey === 'manufacturing') {
                addEditForm.processPerformance.id = value.processPerformance.id
            } else if (blockKey === 'companyScale') {
                addEditForm.otherSpecialNotes.id = value.otherSpecialNotes.id
            }
            await getMenuData(value.id)
            ElMessage.success(`${getBlockName(blockKey)}保存成功`)
        }
    } finally {
        detailLoading.value = false
    }
}

// 获取块的中文名称（用于提示）
const getBlockName = (blockKey: string) => {
    const blockNames = {
        accessApplication: '准入申请',
        basicInfo: '基本情况',
        personnelInfo: '人员信息',
        otherNotes: '企业规模',
        qualification: '企业资质表',
        productsQuality: '主营产品情况及质量业绩',
        rawMaterials: '主要原材料及供应商',
        manufacturing: '生产制造过程绩效',
        equipment: '生产及检验设备',
        companyScale: '其他特别说明'
    }
    return blockNames[blockKey] || blockKey
}

// 计算属性实时判断是否所有保存
const allCompleted = computed(() => {
    return Object.values(saveStatus).every((value) => value === true)
})
const submitLoading = ref<Boolean>(false)
const handleSubmit = async () => {
    if (allCompleted.value) {
        submitLoading.value = true
        const { state } = await dataAudit(addEditForm.id)
        if (state) {
            submitLoading.value = false
            ElMessage.success('提交成功')
            handleCancel()
        } else {
            submitLoading.value = false
        }
    } else {
        ElMessage.warning('请先填写保存所有必填项')
    }
}

const handleCancel = () => {
    router.push({ name: 'AccessApplication' })
}

// 获取保存状态样式类
const getSaveStatusClass = (sectionId: string) => {
    const menuItem = menuItems.value.find((item) => item.id === sectionId)
    if (!menuItem) return 'save-icon not-saved'

    const isSaved = saveStatus[menuItem.saveStatusKey as keyof typeof saveStatus]
    return isSaved ? 'save-icon saved' : 'save-icon not-saved'
}

// 获取保存状态
const getSaveStatus = (sectionId: string) => {
    const menuItem = menuItems.value.find((item) => item.id === sectionId)
    if (!menuItem) return false

    return saveStatus[menuItem.saveStatusKey as keyof typeof saveStatus]
}

// 供应物资选择
const materialIsShowDialog = ref(false)
const materialSelectedContent = ref([])
const materialChange = () => {
    materialIsShowDialog.value = true
}

const materialSelectedChange = (data: any) => {
    materialSelectedContent.value = data
    if (data.length > 0) {
        addEditForm.materialCategory2List = data.map(({ id, catName, ...rest }) => ({
            ...rest,
            catName: catName,
            categoryName: catName,
            categoryId: id
        }))
        addEditForm.gategoryNames = data.map((item: any) => item.catName).join(',')
    } else {
        addEditForm.materialCategory2List = []
        addEditForm.gategoryNames = ''
    }
}

//获取企业信息
const getEnterpriseList = async () => {
    const data = await getOwnerEnterprise()
    addEditForm.information.enterpriseId = data.id
    addEditForm.information.enterpriseName = data.companyName
    addEditForm.information.enterpriseCode = data.companyCode

    addEditForm.recommendedDepartment = data.companyName
    addEditForm.enterprise = { ...data }
    //获取资质信息
    getQualificationListChange(data.id)
}

//获取供应商信息
const enterpriseList = ref([])
const supplierLoading = ref(false)
const changeEnterpr = (value: any) => {
    enterpriseList.value.forEach((item: any) => {
        if (item.orgId === value) {
            addEditForm.enterpriseName = item.companyName
            addEditForm.enterpriseCode = item.companyCode
        }
    })
}
const remoteSearchSupplier = async (query: string) => {
    if (query) {
        supplierLoading.value = true
        try {
            const params = {
                pageBean: { page: 1, pageSize: -1 },
                querys: [
                    {
                        group: 'main',
                        operation: 'LIKE',
                        property: 'companyName',
                        relation: 'AND',
                        value: query
                    }
                ]
            }
            const { rows = [] } = await getSupplier(params)
            enterpriseList.value = rows
        } finally {
            supplierLoading.value = false
        }
    } else {
        enterpriseList.value = []
    }
}

//获取左菜单数据
const fieldMapping = {
    enterpriseAccessFlag: { saveStatusKey: 'accessApplication', title: '准入申请信息' },
    basicInformationFlag1: { saveStatusKey: 'basicInfo', title: '基本情况' },
    accessPersonnelFlag: { saveStatusKey: 'personnelInfo', title: '人员信息' },
    basicInformationFlag2: { saveStatusKey: 'otherNotes', title: '企业规模' },
    qualificationFlag: { saveStatusKey: 'qualification', title: '企业资质表' },
    mainProductsPerformanceFlag: {
        saveStatusKey: 'productsQuality',
        title: '主营产品情况及质量业绩'
    },
    mainRawMaterialsSuppliersFlag: { saveStatusKey: 'rawMaterials', title: '主要原材料及供应商' },
    productionProcessPerformanceFlag: {
        saveStatusKey: 'manufacturing',
        title: '生产制造过程绩效'
    },
    productionInspectionEquipmentFlag: { saveStatusKey: 'equipment', title: '生产及检验设备' },
    otherSpecialNotesFlag: { saveStatusKey: 'companyScale', title: '其他特别说明' }
}
const generateId = (saveStatusKey: string) => {
    const idMap = {
        accessApplication: 'access-application',
        basicInfo: 'basic-info',
        personnelInfo: 'personnel-info',
        otherNotes: 'other-notes',
        qualification: 'qualification',
        productsQuality: 'products-quality',
        rawMaterials: 'raw-materials',
        manufacturing: 'manufacturing',
        equipment: 'equipment',
        companyScale: 'company-scale'
    }
    return idMap[saveStatusKey] || saveStatusKey
}
const processApiResponse = (apiData) => {
    // 清空现有数据
    menuItems.value = []
    Object.keys(saveStatus).forEach((key) => delete saveStatus[key])

    const usedKeys = new Set()
    const itemsWithIndex = []

    // 按照 fieldMapping 的顺序遍历
    Object.keys(fieldMapping).forEach((apiField, index) => {
        const value = apiData[apiField]
        const config = fieldMapping[apiField]

        if (config && value !== '') {
            const { saveStatusKey, title } = config
            const statusValue = value === '1'

            // 设置保存状态
            saveStatus[saveStatusKey] = statusValue

            // 收集需要添加的项，记录其在 fieldMapping 中的索引位置（避免重复）
            if (!usedKeys.has(saveStatusKey)) {
                itemsWithIndex.push({
                    item: {
                        id: generateId(saveStatusKey),
                        title: title,
                        saveStatusKey: saveStatusKey
                    },
                    index: index
                })
                usedKeys.add(saveStatusKey)
            }
        }
    })

    // 按照 fieldMapping 中的索引顺序添加到 menuItems
    itemsWithIndex.sort((a, b) => a.index - b.index)
    menuItems.value = itemsWithIndex.map(({ item }) => item)
}
const getMenuData = async (ids: string) => {
    try {
        detailLoading.value = true
        let param = ids ? ids : ''
        const data = await getFillingProgress(param)
        processApiResponse(data)
    } finally {
        detailLoading.value = false
    }
}

//获取资质类型
const qualificationList1 = ref([])
const qualificationList2 = ref([])
const qualificationList3 = ref([])
const getQualificationListChange = async (id: string) => {
    let value1 = []
    value1 = await getQualificationType(id, '1')
    qualificationList1.value = JSON.parse(JSON.stringify(value1))
    addEditForm.qualificationMap.additionalProperties1 = JSON.parse(JSON.stringify(value1))

    qualificationList2.value = await getQualificationType(id, '2')

    qualificationList3.value = await getQualificationType(id, '3')
}
const qualificationChange = (value: string, index: number, type: string, row: object) => {
    const qualificationList = {
        '1': qualificationList1,
        '2': qualificationList2,
        '3': qualificationList3
    }
    qualificationList[type].value.forEach((item: any) => {
        if (item.qualificationCategoryCode === value) {
            addEditForm.qualificationMap[`additionalProperties${type}`][index] = {
                ...row,
                ...item,
                files: []
            }
        }
    })
}

onMounted(() => {
    const storedData = localStorage.getItem('user')
    if (storedData) {
        addEditForm.referrer = JSON.parse(storedData).userInfo.username
    }

    // 确保activeMenuItem指向一个存在的菜单项
    if (!hasMenuItem(activeMenuItem.value) && menuItems.value.length > 0) {
        activeMenuItem.value = menuItems.value[0].id
    }

    // 如果是编辑模式，获取详情数据
    if (route.query.id && typeof route.query.id === 'string') {
        getDetail(route.query.id)
        getMenuData(route.query.id)
    } else {
        getMenuData('')
        getEnterpriseList()
    }

    // 设置滚动监听
    setTimeout(() => {
        // 查找滚动容器
        scrollContainer = document.querySelector('.page-form') as HTMLElement

        // 添加滚动监听器
        if (scrollContainer) {
            scrollContainer.addEventListener('scroll', debouncedHandleScroll)
        } else {
            // 如果没有找到滚动容器，监听window滚动
            window.addEventListener('scroll', debouncedHandleScroll)
        }

        // 初始化滚动位置
        const element = document.getElementById(activeMenuItem.value)
        if (element) {
            element.scrollIntoView({
                behavior: 'instant',
                block: 'start'
            })
        }
    }, 100)
})

onUnmounted(() => {
    // 清理滚动监听器
    if (scrollContainer) {
        scrollContainer.removeEventListener('scroll', debouncedHandleScroll)
    } else {
        window.removeEventListener('scroll', debouncedHandleScroll)
    }
})
</script>

<style lang="scss" scoped>
.edit-add-detail {
    .form-content {
        display: flex;
        flex-direction: column;
        align-items: center;

        .page-form {
            width: 80%;
            overflow-x: hidden;
            overflow-y: auto;
            max-height: 100%;
            padding: 0 20px;

            /* 隐藏滚动条样式 */
            &::-webkit-scrollbar {
                width: 0;
                height: 0;
            }

            &::-webkit-scrollbar-track {
                background: transparent;
            }

            &::-webkit-scrollbar-thumb {
                background: transparent;
            }

            /* Firefox 隐藏滚动条 */
            scrollbar-width: none;
            -ms-overflow-style: none;
        }

        .step-container {
            width: 100%;
            margin-bottom: 20px;
            padding: 20px;
            border-radius: 8px;
        }

        .main-content {
            display: flex;
            gap: 20px;
            width: 100%;
            padding-bottom: 20px;

            .sidebar-menu {
                width: 180px;
                background-color: var(--theme-search-wrapper-bg);
                box-shadow: 0px 0px 20px 0px rgba(0, 36, 65, 0.2);
                border-radius: 16px;
                padding: 10px 20px 20px 20px;
                height: fit-content;
                position: sticky;
                top: 10px;

                .menu-section {
                    margin-bottom: 30px;

                    .menu-title {
                        font-size: 16px;
                        font-weight: bold;
                        color: var(--theme-text-primary);
                        white-space: pre;
                    }

                    .menu-items {
                        .menu-item {
                            font-size: 14px;
                            padding: 10px 15px;
                            margin-bottom: 5px;
                            cursor: pointer;
                            border-radius: 4px;
                            transition: all 0.3s ease;
                            color: var(--theme-text-primary);
                            display: flex;
                            justify-content: space-between;
                            align-items: center;

                            &:hover {
                                background-color: var(--theme-system-module-1);
                                color: var(--theme-primary);
                            }

                            &.active {
                                background-color: var(--theme-primary);
                                color: white;
                            }

                            .save-icon {
                                font-size: 20px;

                                &.saved {
                                    color: #67c23a; /* 绿色 */
                                }

                                &.not-saved {
                                    color: #c0c4cc; /* 灰色 */
                                }
                            }
                        }
                    }
                }
            }

            .content-area {
                width: calc(100% - 180px - 80px);
                background-color: var(--theme-form-content-bg);
                border-radius: 8px;
                padding: 20px 20px 0 20px;

                .content-section {
                    margin-bottom: 20px;

                    .content-title {
                        margin-bottom: 5px;
                        display: flex;
                        justify-content: space-between;
                        align-items: center;

                        .content-title-left {
                            font-size: 14px;
                            font-weight: bold;
                            color: var(--theme-text-primary);
                            display: flex;
                            align-items: center;
                        }

                        .content-title-left::before {
                            content: '';
                            display: inline-block;
                            width: 4px;
                            height: 18px;
                            background-color: #1a8cff;
                            border-radius: 2px;
                            margin-right: 8px;
                        }
                    }

                    .site-inspection-content {
                        background-color: #f5f8fa;
                        padding: 16px;
                        box-sizing: border-box;

                        .review-requirements {
                            margin-bottom: 10px;

                            .review-requirements-title {
                                color: var(--theme-text-primary);
                                margin-bottom: 5px;
                                font-size: 14px;
                                font-weight: bold;
                            }

                            ul {
                                list-style: none;

                                li {
                                    color: var(--theme-text-primary);
                                    line-height: 25px;
                                    font-size: 14px;
                                }
                            }
                        }
                    }

                    .section-content {
                        color: var(--theme-text-inverse);

                        .review-actions {
                            display: flex;
                            padding: 10px 0 10px 10px;
                        }
                    }
                }
            }
        }
    }
}

// 表格相关样式
.operation-buttons {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.table-header {
    margin: 10px 0 10px 10px;
    display: flex;
    justify-content: flex-start;
}

.attachment-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;

    .attachment-name {
        font-size: 12px;
        color: var(--theme-text-color);
    }
}
</style>
