<template>
    <el-card class="myDetailCard">
        <template #header>
            <div class="card-header">
                <span>媒体信息</span>
                <el-icon style="float: right;cursor: pointer;" @click="handleClose" v-if="showClose">
                    <Close />
                </el-icon>
            </div>
        </template>

        <el-form ref="detailFormRef" :model="detailForm" label-width="200px" class="myDetailForm">
            <div class="supplierTitleContainer">
                <div class="supplierNameIcon" />
                <div class="supplierNameTitle">{{ detailForm.mediaName }}</div>
            </div>
            <el-collapse class="my-collapse" v-model="activeNames" @change="handleChange">
                <el-collapse-item title="业务部门" name="1">
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="6">
                            <el-form-item label="业务部门" prop="business">
                                {{ detailForm.dataScopeDeptName }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-collapse-item>
                <el-collapse-item title="媒体基础信息" name="2">
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="6">
                            <el-form-item label="状态" prop="business_department">
                                <span v-if="detailForm.state == 1">生效中</span>
                                <span v-if="detailForm.state == 2">已作废</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="媒体编号" prop="business_department">
                                {{ detailForm.mediaCode }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="供应商/媒体形式/名称" prop="business_department">
                                {{ detailForm.mediaName }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="6">
                            <el-form-item label="媒体类型" prop="business_department">
                                {{ detailForm.mediaTypeStr }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="媒体大类" prop="business_department">
                                {{ detailForm.mediaCategoryStr }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="展示形式" prop="business_department">
                                {{ detailForm.displayFormStr }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="6">
                            <el-form-item label="是否有照明" prop="business_department">
                                {{ detailForm.hasLighting }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="播放时间" prop="business_department">
                                {{ detailForm.playbackTime }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="日均车流量" prop="business_department">
                                {{ detailForm.dailyAvgVehicleFlow }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="12">
                            <el-form-item label="MR" prop="business_department">
                                {{ detailForm.mr }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="媒体尺寸" prop="business_department">
                                {{ detailForm.mediaSize }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="媒体朝向" prop="business_department">
                                {{ detailForm.mediaOrientation }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="供应商名称">
                                <span class="mediaNameLabel"
                                    @click="handleOpenSupplierDetail(detailForm.belongSupplierId)">
                                    {{ detailForm.belongSupplierName }}
                                </span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="12">
                            <el-form-item label="城市" prop="business_department">
                                <span v-if="detailForm.provinceName">{{ detailForm.provinceName }}</span>
                                <span v-if="detailForm.cityName">-{{ detailForm.cityName }}</span>
                                <span v-if="detailForm.areaName">-{{ detailForm.areaName }}</span>
                                <span v-if="detailForm.townName">-{{ detailForm.townName }}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="商圈" prop="business_department">
                                {{ detailForm.businessDistrictName }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="地址" prop="business_department">
                                {{ detailForm.address }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="地理位置">
                                {{ detailForm.mapY }},{{ detailForm.mapX }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="6">
                            <el-form-item label="最小购买周期">
                                {{ detailForm.minPurchaseCycle }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="首次制作安装费">
                                {{ detailForm.firstInstallFee }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="换刊制作安装费">
                                {{ detailForm.changeInstallFee }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-collapse-item>
                <el-collapse-item title="媒体报价信息" name="3">
                    <div v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <competitiveOffer ref="competitiveOfferRef" />
                    </div>
                    <div v-if="detailForm.dataScopeDeptName == '网络媒体部'">
                        <el-tabs v-model="activePriceType" @tab-click="handlePriceTypeClick">
                            <el-tab-pane label="门禁" name="门禁">
                                <accessControlPrice ref="accessControlPriceRef" />
                            </el-tab-pane>
                            <el-tab-pane label="候车厅" name="候车厅">
                                <waitingHallPrice ref="waitingHallPriceRef" />
                            </el-tab-pane>
                            <el-tab-pane label="道闸" name="道闸">
                                <barrierGatePrice ref="barrierGatePriceRef" />
                            </el-tab-pane>
                            <el-tab-pane label="地铁" name="地铁">
                                <subwayPrice ref="subwayPriceRef" />
                            </el-tab-pane>
                            <el-tab-pane label="高铁" name="高铁">
                                <highSpeedRailway ref="highSpeedRailwayRef" />
                            </el-tab-pane>
                            <el-tab-pane label="写字楼" name="写字楼">
                                <officeBuilding ref="officeBuildingRef" />
                            </el-tab-pane>
                            <el-tab-pane label="车库灯箱" name="车库灯箱">
                                <garageLightBox ref="garageLightBoxRef" />
                            </el-tab-pane>
                        </el-tabs>
                    </div>
                </el-collapse-item>
                <el-collapse-item title="媒体深度信息" name="4">
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="6">
                            <el-form-item label="媒体归属名称">
                                {{ detailForm.belongName }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="联系人">
                                {{ detailForm.contactUserName }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="联系电话" prop="business">
                                {{ detailForm.contactUserPhone }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="媒体是否有改造" prop="business">
                                <span v-if="detailForm.hasReform == 0">否</span>
                                <span v-if="detailForm.hasReform == 1">是</span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="6">
                            <el-form-item label="发票类型">
                                {{ detailForm.invoiceType }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="税点">
                                {{ detailForm.taxRate }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="付款要求">
                                {{ detailForm.paymentRequirements }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="媒体公司名称" prop="business">
                                {{ detailForm.mediaCompanyName }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="6">
                            <el-form-item label="物业公司名称" prop="business">
                                {{ detailForm.propertyCompanyName }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="审批部门" prop="business">
                                {{ detailForm.approvalDept }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="批文情况">
                                {{ detailForm.approvalSituation }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="批文发布时间">
                                {{ detailForm.approvalReleaseTime }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="6">
                            <el-form-item label="媒体独家授权" prop="business">
                                {{ detailForm.soleAgentAuth }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="独家授权时间">
                                {{ detailForm.soleAgentAuthTime }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="媒体行业授权" prop="business">
                                {{ detailForm.industryAuth }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="媒体行业授权时间">
                                {{ detailForm.industryAuthTime }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="行业限制" prop="business">
                                {{ detailForm.industryLimit }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="媒体曾经经营公司" prop="business">
                                {{ detailForm.everManagerCompany }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="媒体时间线" prop="business">
                                {{ detailForm.mediaTimeline }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="曾经媒体情况" prop="business">
                                {{ detailForm.everMediaSituation }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="媒体历史事件" prop="business">
                                {{ detailForm.mediaHistory }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '网络媒体部'">
                        <el-col :span="24">
                            <el-form-item label="同类媒体公司" prop="business">
                                {{ detailForm.equalsMediaCompany }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '网络媒体部'" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="其他" prop="business">
                                {{ detailForm.other }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="批文文件" class="filesItemContent">
                                <supplierDetailFile ref="approvalDocumentRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="独家授权文件" class="filesItemContent">
                                <supplierDetailFile ref="exclusiveLicenseFileRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="媒体行业授权文件" class="filesItemContent">
                                <supplierDetailFile ref="mediaLicenseFileRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '网络媒体部'">
                        <el-col :span="24">
                            <el-form-item label="媒体归属附件" class="filesItemContent">
                                <supplierDetailFile ref="mediaOwnershipRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '网络媒体部'" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="曾经媒体照片" prop="business" class="filesItemContent">
                                <supplierDetailFile ref="onceMediaPhotoRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-collapse-item>
                <el-collapse-item title="其他信息" name="5">
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="优势" prop="business">
                                {{ detailForm.advantages }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="备注" prop="business">
                                {{ detailForm.remark }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="图片上传" class="filesItemContent" prop="business_department">
                                <supplierDetailFile ref="mediaPicRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" />
                    <el-row :gutter="30" class="my_form_row">
                        <el-col :span="24">
                            <el-form-item label="视频上传" class="filesItemContent" prop="business_department">
                                <supplierDetailFile ref="mediaVideoRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="盖章刊例" class="filesItemContent" prop="business">
                                <supplierDetailFile ref="stampedPublicationRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="资质文件" class="filesItemContent" prop="business">
                                <supplierDetailFile ref="qualificationFileRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="媒体链条" class="filesItemContent" prop="business">
                                <supplierDetailFile ref="mediaChainRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '优势媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '优势媒体部'">
                        <el-col :span="24">
                            <el-form-item label="刊例照片" class="filesItemContent" prop="business">
                                <supplierDetailFile ref="journalCataloguePhotoRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <div class="splineBar" v-if="detailForm.dataScopeDeptName == '网络媒体部'" />
                    <el-row :gutter="30" class="my_form_row" v-if="detailForm.dataScopeDeptName == '网络媒体部'">
                        <el-col :span="24">
                            <el-form-item label="MR和制作要求" class="filesItemContent" prop="business">
                                <supplierDetailFile ref="mRProductionRequirementsRef" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-collapse-item>
            </el-collapse>
        </el-form>
    </el-card>
</template>
<script setup>
import { onMounted, nextTick, defineEmits, ref } from 'vue'
import { Close } from '@element-plus/icons-vue'
import { mediaDetail } from "@/api/mediaLibrary"

import competitiveOffer from './components/competitiveOffer.vue'
import accessControlPrice from './components/accessControlPrice.vue'
import waitingHallPrice from './components/waitingHallPrice.vue'
import barrierGatePrice from './components/barrierGatePrice.vue'
import subwayPrice from './components/subwayPrice.vue'
import highSpeedRailway from './components/highSpeedRailway.vue'
import officeBuilding from './components/officeBuilding.vue'
import garageLightBox from './components/garageLightBox.vue'
import supplierDetailFile from '../../components/FileUpload/supplierDetailFile.vue';
import { useRouter } from 'vue-router'

const router = useRouter()
const { proxy } = getCurrentInstance()
const emit = defineEmits(['handleShowList']);
// 详情参数
const detailForm = ref({})
const activePriceType = ref('门禁')
const activeNames = ref(['1', '2', '3', '4'])
const showClose = ref(true)
// 优势媒体报价组件
const competitiveOfferRef = ref(null)
// 网络媒体门禁报价组件
const accessControlPriceRef = ref(null)
// 网络媒体门候车厅报价组件
const waitingHallPriceRef = ref(null)
// 网络媒体道闸报价组件
const barrierGatePriceRef = ref(null)
// 网络媒体地铁报价组件
const subwayPriceRef = ref(null)
// 网络媒体高铁报价组件
const highSpeedRailwayRef = ref(null)
// 网络媒体写字楼报价组件
const officeBuildingRef = ref(null)
// 网络媒体车库灯箱报价组件
const garageLightBoxRef = ref(null)

// 批文文件组件
const approvalDocumentRef = ref(null)
// 独家授权文件
const exclusiveLicenseFileRef = ref(null)
// 媒体行业授权文件
const mediaLicenseFileRef = ref(null)
// 媒体归属附件
const mediaOwnershipRef = ref(null)
// 曾经媒体照片
const onceMediaPhotoRef = ref(null)
// 图片上传
const mediaPicRef = ref(null)
// 视频上传
const mediaVideoRef = ref(null)
// 盖章刊例
const stampedPublicationRef = ref(null)
// 资质文件
const qualificationFileRef = ref(null)
// 媒体链条
const mediaChainRef = ref(null)
// 刊例照片
const journalCataloguePhotoRef = ref(null)
// MR和制作要求
const mRProductionRequirementsRef = ref(null)

// 返回
const handleClose = () => {
    emit('handleShowList')
}
// 折叠面板点击
const handleChange = (val) => {
    activeNames.value = val
}
// 报价类型切换
const handlePriceTypeClick = (tab, event) => {
    activePriceType.value = tab.props.name
    if (activePriceType.value == '门禁') accessControlPriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (activePriceType.value == '候车厅') waitingHallPriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (activePriceType.value == '道闸') barrierGatePriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (activePriceType.value == '地铁') subwayPriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (activePriceType.value == '高铁') highSpeedRailwayRef.value.getMediaPrice(detailForm.value.id, false)
    if (activePriceType.value == '写字楼') officeBuildingRef.value.getMediaPrice(detailForm.value.id, false)
    if (activePriceType.value == '车库灯箱') garageLightBoxRef.value.getMediaPrice(detailForm.value.id, false)
}
// 初始化
const handleChangeDept = (val) => {
    if (detailForm.value.dataScopeDeptName == '优势媒体部' && competitiveOfferRef.value) competitiveOfferRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '门禁') accessControlPriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '候车厅') waitingHallPriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '道闸') barrierGatePriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '地铁') subwayPriceRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '高铁') highSpeedRailwayRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '写字楼') officeBuildingRef.value.getMediaPrice(detailForm.value.id, false)
    if (detailForm.value.dataScopeDeptName == '网络媒体部' && activePriceType.value == '车库灯箱') garageLightBoxRef.value.getMediaPrice(detailForm.value.id, false)
}
const getMediaInfo = () => {
    showClose.value = true
    mediaDetail({ mediaId: detailForm.value.id }).then(res => {
        detailForm.value = res.data
        handleChangeDept(res.data.dataScopeDeptName)
        if (detailForm.value.mediaFile && detailForm.value.mediaFile.length > 0) {
            if (approvalDocumentRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 1)
                approvalDocumentRef.value.setFileInfo(fileList)
            }
            if (exclusiveLicenseFileRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 2)
                exclusiveLicenseFileRef.value.setFileInfo(fileList)
            }
            if (mediaLicenseFileRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 3)
                mediaLicenseFileRef.value.setFileInfo(fileList)
            }
            if (mediaOwnershipRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 4)
                mediaOwnershipRef.value.setFileInfo(fileList)
            }
            if (onceMediaPhotoRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 5)
                onceMediaPhotoRef.value.setFileInfo(fileList)
            }
            if (mediaPicRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 6)
                mediaPicRef.value.setFileInfo(fileList)
            }
            if (mediaVideoRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 7)
                mediaVideoRef.value.setFileInfo(fileList)
            }
            if (stampedPublicationRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 8)
                stampedPublicationRef.value.setFileInfo(fileList)
            }
            if (qualificationFileRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 9)
                qualificationFileRef.value.setFileInfo(fileList)
            }
            if (mediaChainRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 10)
                mediaChainRef.value.setFileInfo(fileList)
            }
            if (journalCataloguePhotoRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 11)
                journalCataloguePhotoRef.value.setFileInfo(fileList)
            }
            if (mRProductionRequirementsRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 12)
                mRProductionRequirementsRef.value.setFileInfo(fileList)
            }
        }
    })
}
// 打开供应商详情
const handleOpenSupplierDetail = (supplierId) => {
    router.push('/supplier/detailPage/' + supplierId)
}
const initForm = (_ruleForm) => {
    detailForm.value = _ruleForm
    if (detailForm.value.id) getMediaInfo()
}
// 外部链接过来的
const linkGetMediaInfo = (_mediaId) => {
    showClose.value = false
    mediaDetail({ mediaId: _mediaId }).then(res => {
        detailForm.value = res.data
        handleChangeDept(res.data.dataScopeDeptName)
        if (detailForm.value.mediaFile && detailForm.value.mediaFile.length > 0) {
            if (approvalDocumentRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 1)
                approvalDocumentRef.value.setFileInfo(fileList)
            }
            if (exclusiveLicenseFileRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 2)
                exclusiveLicenseFileRef.value.setFileInfo(fileList)
            }
            if (mediaLicenseFileRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 3)
                mediaLicenseFileRef.value.setFileInfo(fileList)
            }
            if (mediaOwnershipRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 4)
                mediaOwnershipRef.value.setFileInfo(fileList)
            }
            if (onceMediaPhotoRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 5)
                onceMediaPhotoRef.value.setFileInfo(fileList)
            }
            if (mediaPicRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 6)
                mediaPicRef.value.setFileInfo(fileList)
            }
            if (mediaVideoRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 7)
                mediaVideoRef.value.setFileInfo(fileList)
            }
            if (stampedPublicationRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 8)
                stampedPublicationRef.value.setFileInfo(fileList)
            }
            if (qualificationFileRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 9)
                qualificationFileRef.value.setFileInfo(fileList)
            }
            if (mediaChainRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 10)
                mediaChainRef.value.setFileInfo(fileList)
            }
            if (journalCataloguePhotoRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 11)
                journalCataloguePhotoRef.value.setFileInfo(fileList)
            }
            if (mRProductionRequirementsRef.value) {
                const fileList = detailForm.value.mediaFile.filter(item => item.fileType == 12)
                mRProductionRequirementsRef.value.setFileInfo(fileList)
            }
        }
    })
}
// 暴露方法\属性给父组件
defineExpose({
    initForm,
    linkGetMediaInfo
});
</script>
<style lang='scss'>
.supplierTitleContainer {
    width: 100%;
    height: 26px;
    margin-bottom: 20px;
}

.supplierNameIcon {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: #ffc63d;
    margin: 0px 10px 4px 0px;
}

.supplierNameTitle {
    display: inline-block;
    font-family: Microsoft YaHei;
    font-weight: 600;
    font-size: 22px;
    color: #1E1E1E;
}

// 分割线
.splineBar {
    width: 100%;
    height: 1px;
    background: #D9DFE5;
}

.mediaNameLabel {
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #1A75E6;
    cursor: pointer;
}

.mybadge .el-badge__content.is-dot {
    width: 6px;
    height: 6px;
    background-color: #126601;
    margin-right: 10px;
}

.myMedioStatus {
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #126601;
}
</style>