front/front-vue/src/views/service/companyInformation/companyInformation.vue

<template>
<div class="app-container zap-main">
    <div class="zap-content" style="min-height: calc(100vh - 200px)">
        <el-tabs v-model="activeName" style="margin:2px">
            <!--———————————————————————————————————— 附件信息 ————————————————————————————————————————————————-->
            <el-tab-pane v-if="companyType != '03'" label="附件信息" name="first">
                <el-row  class="zap-business">
                    <div v-if="licenShow" class="zap-business__item">
                        <div class="zap-business__title">营业执照:</div>
                        <div class="zap-business__picture">
                            <el-upload v-if="licenShow" ref="licenImg" action="" 
                                multiple list-type="picture-card" 
                                :file-list="licenseFileList" 
                                :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }"
                                :auto-upload="false">
                                <i slot="default" class="el-icon-plus"></i>
                                <div slot="file" slot-scope="{file}">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                                    <span class="el-upload-list__item-actions">
                                        <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                            <i class="el-icon-zoom-in"></i>
                                        </span>
                                        <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                            <i class="el-icon-download"></i>
                                        </span>
                                    </span>
                                </div>
                            </el-upload>
                        </div>
                    </div>
                    <div v-if="authorizationShow" class="zap-business__item">
                        <div class="zap-buisness__title">法人授权书:</div>
                        <div class="zap-business__picture">
                            <el-upload v-if="authorizationShow" ref="authorizationImg" action="" 
                                multiple list-type="picture-card" 
                                :file-list="authorizationFileList" 
                                :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }"
                                :auto-upload="false">
                                <i slot="default" class="el-icon-plus"></i>
                                <div slot="file" slot-scope="{file}">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                                    <span class="el-upload-list__item-actions">
                                        <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                            <i class="el-icon-zoom-in"></i>
                                        </span>
                                        <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                            <i class="el-icon-download"></i>
                                        </span>
                                    </span>
                                </div>
                            </el-upload>
                        </div>
                    </div>
                </el-row>
                <el-row class="zap-business">
                    <div v-if="handlerPositiveShow || handlerNegativeShow" class="zap-business__item">
                        <div class="zap-business__title">经办人信息:</div>
                        <div class="zap-business__picture">
                            <el-upload v-if="handlerPositiveShow" ref="handlerPositiveImg" action="" multiple :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }" list-type="picture-card" :file-list="handlerPositiveList" :auto-upload="false">
                                <i slot="default" class="el-icon-plus"></i>
                                <div slot="file" slot-scope="{file}">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                                    <span class="el-upload-list__item-actions">
                                        <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                            <i class="el-icon-zoom-in"></i>
                                        </span>
                                        <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                            <i class="el-icon-download"></i>
                                        </span>
                                    </span>
                                </div>
                            </el-upload>
                        </div>
                        <div class="zap-business__picture">
                            <el-upload v-if="handlerNegativeShow" ref="handlerNegativeImg" action="" multiple :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }" list-type="picture-card" :file-list="handlerNegativeList" :auto-upload="false">
                                <i slot="default" class="el-icon-plus"></i>
                                <div slot="file" slot-scope="{file}">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                                    <span class="el-upload-list__item-actions" >
                                        <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)"  >
                                            <i class="el-icon-zoom-in"></i>
                                        </span>
                                        <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                            <i class="el-icon-download"></i>
                                        </span>
                                    </span>
                                </div>
                            </el-upload>
                        </div>
                    </div>
                    <div v-if="commitmentShow" class="zap-business__item">
                        <div class="zap-business__title">数字证书授权与承诺书:</div>
                        <div class="zap-business__picture">
                            <el-upload v-if="commitmentShow" ref="commitmentImg" action="" 
                                multiple list-type="picture-card" 
                                :file-list="commitmentFileList" 
                                :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }"
                                :auto-upload="false">
                                <i slot="default" class="el-icon-plus"></i>
                                <div slot="file" slot-scope="{file}">
                                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                                    <span class="el-upload-list__item-actions">
                                        <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                            <i class="el-icon-zoom-in"></i>
                                        </span>
                                        <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                            <i class="el-icon-download"></i>
                                        </span>
                                    </span>
                                </div>
                            </el-upload>
                        </div>
                    </div>
                </el-row>
                <el-row class="zap-business">
                    <div v-if="legalShow || legalBackShow">
                        <div class="zap-business__title">法人证件:</div>
                        <el-row type="flex" align="middle">
                            <div class="zap-business__picture">
                                <el-upload ref="legalImg" v-if="legalShow" class="Img-demo" action="" multiple :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }" list-type="picture-card" :file-list="legalFileList" :auto-upload="false" >
                                    <i slot="default" class="el-icon-plus"></i>
                                    <div slot="file" slot-scope="{file}" >
                                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" >
                                        <span class="el-upload-list__item-actions">
                                            <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                                <i class="el-icon-zoom-in"></i>
                                            </span>
                                            <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                                <i class="el-icon-download"></i>
                                            </span>
                                        </span>
                                    </div>
                                </el-upload>
                            </div>
                            <div class="zap-business__picture">
                                <el-upload ref="legalBackImg" v-if="legalBackShow" class="Img-demo" action="" multiple :class="{ uoloadSty: showBtnImg, disUoloadSty: noBtnImg }" list-type="picture-card" :file-list="legalBackFileList" :auto-upload="false">
                                    <i slot="default" class="el-icon-plus"></i>
                                    <div slot="file" slot-scope="{file}">
                                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                                        <span class="el-upload-list__item-actions">
                                            <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                                                <i class="el-icon-zoom-in"></i>
                                            </span>
                                            <span class="el-upload-list__item-delete" @click="handleImgDownload(file)">
                                                <i class="el-icon-download"></i>
                                            </span>
                                        </span>
                                    </div>
                                </el-upload>
                            </div>
                        </el-row>
                    </div>
                </el-row>
                <el-row>
                     <div v-if="scyCfcaUserId" class="zap-business__text">
                        CFCA企业认证证书:<span>{{scyCfcaUserId}}</span>
                    </div>
                    <div class="zap-business__text">
                    CFCA授权编号:<span v-if="scyCfcaAuthNumber">{{scyCfcaAuthNumber}}</span>
                    <label v-else text="abcdef" id="lab1" style="color:blue" @click="openWindows">激活</label>
                    </div>
                    <!-- <el-upload v-if="commitmentShow" ref="upload" class="upload-demo" action="" 
                    :on-preview="handleFilePreview" multiple :file-list="commitmentFileList" :auto-upload="false">
                    </el-upload> -->
                </el-row>
            </el-tab-pane>
            <!--——————————————————————————————————————————基本信息————————————————————————————————————————————————————-->
            <el-tab-pane v-if="form.scyType !='03'" label="基本信息" name="fourth">
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">企业类型</span>
                            <div class="zap-form-text__file">{{scyTypeFormat(form.scyType)}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">机构名称</span>
                            <div class="zap-form-text__file">{{form.scyName}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">机构代码</span>
                            <div class="zap-form-text__file">{{form.scySocialCode}}</div>
                        </div>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">证件注册日</span>
                            <div class="zap-form-text__file">{{form.scyStartTime}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">注册地址</span>
                            <div class="zap-form-text__file">{{form.scyAddress}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">证件到期日</span>
                            <div class="zap-form-text__file">{{form.scyEndTime}}</div>
                        </div>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">注册资本</span>
                            <div class="zap-form-text__file">{{form.scyRegisteredCapital}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">法人姓名</span>
                            <div class="zap-form-text__file">{{form.scyLegal}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">证件类型</span>
                            <div class="zap-form-text__file">身份证</div>
                        </div>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">联系方式</span>
                            <div class="zap-form-text__file">{{form.scyPhone}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">证件号码</span>
                            <div class="zap-form-text__file">{{form.scyLegalId}}</div>
                        </div>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <el-tab-pane v-if="companyType =='03'" label="基本信息" name="first">
                <el-form ref="form" :model="form" label-width="130px" :inline="true">
                    <!-- <el-form-item label="所属行业" prop="scyIndustry">
                        <el-input v-model="form.scyIndustry" placeholder="请输入所属行业" maxlength="20" show-word-limit disabled />
                    </el-form-item>
                    <el-form-item label="企业规模" prop="scyScale">
                        <el-select v-model="form.scyScale" placeholder="企业规模" clearable size="small" disabled>
                            <el-option v-for="dict in scyScaleOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="机构性质" prop="scyOrganization">
                        <el-select v-model="form.scyOrganization" placeholder="机构性质" clearable size="small" disabled>
                            <el-option v-for="dict in scyOrganizationOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue"></el-option>
                        </el-select>
                    </el-form-item> -->
                    <el-form-item label="企业类型" prop="scyType">
                        <el-input :value= scyTypeFormat(form.scyType) disabled></el-input>
                    </el-form-item>
                    <!-- <el-form-item label="客户经理" prop="scyManager">
                        <el-input v-model="form.scyManager" placeholder="请输入客户经理" maxlength="20" show-word-limit />
                    </el-form-item> -->
                    <el-form-item label="机构名称" prop="scyName">
                        <el-input v-model="form.scyName" disabled />
                    </el-form-item>
                    <el-form-item label="机构代码" prop="scySocialCode">
                        <el-input v-model="form.scySocialCode" disabled />
                    </el-form-item>
                    <el-form-item label="证件注册日" prop="scyStartTime">
                        <el-input v-model="form.scyStartTime" disabled />
                    </el-form-item>
                    <el-form-item label="注册地址" prop="scyAddress">
                        <el-input v-model="form.scyAddress" disabled />
                    </el-form-item>
                    <el-form-item label="证件到期日" prop="scyEndTime">
                        <el-input v-model="form.scyEndTime" disabled />
                    </el-form-item>
                    <el-form-item label="注册资本" prop="scyRegisteredCapital">
                        <el-input v-model="form.scyRegisteredCapital" disabled />
                    </el-form-item>
                    <el-form-item label="法人姓名" prop="scyLegal">
                        <el-input v-model="form.scyLegal" disabled />
                    </el-form-item>
                    <el-form-item label="证件类型" prop="scyLegal">
                        <el-input value="身份证" disabled />
                    </el-form-item>
                    <el-form-item label="联系方式" prop="scyPhone">
                        <el-input v-model="form.scyPhone" disabled />
                    </el-form-item>
                    <el-form-item label="证件号码" prop="scyLegalId">
                        <el-input v-model="form.scyLegalId" disabled />
                    </el-form-item>
                    <!-- <el-button type="primary" @click="submitForm">确 定</el-button>
                    <el-button @click="cancel">取 消</el-button> -->
                </el-form>
            </el-tab-pane>
            <!--————————————————————————————————————联系人信息————————————————————————————————————————————————-->
            <el-tab-pane label="联系人信息" name="second">
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">姓名</span>
                            <div class="zap-form-text__file">{{contactsForm.nickName}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">移动电话</span>
                            <div class="zap-form-text__file">{{contactsForm.userName}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">邮箱</span>
                            <div class="zap-form-text__file">{{contactsForm.email}}</div>
                        </div>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <!--———————————————————————————————————— 发票信息 ————————————————————————————————————————————————-->
            <el-tab-pane v-if="companyType != '03'" label="发票信息" name="third">
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">单位名称</span>
                            <div class="zap-form-text__file">{{invoiceForm.scyName}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">税号</span>
                            <div class="zap-form-text__file">{{invoiceForm.scySocialCode}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">单位地址</span>
                            <div class="zap-form-text__file">{{invoiceForm.ziaAddress}}</div>
                        </div>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">电话号码</span>
                            <div class="zap-form-text__file">{{invoiceForm.ziaContactsPhone}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">开户银行</span>
                            <div class="zap-form-text__file">{{invoiceForm.pbaiBankName}}</div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="zap-form-text">
                            <span class="zap-form-text__label">开户账号</span>
                            <div class="zap-form-text__file">{{invoiceForm.pbaiBankaccountId}}</div>
                        </div>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <!--———————————————————————————————————— 链属关系 ————————————————————————————————————————————————-->
            <el-tab-pane v-if="companyType != '03'" label="链属关系" name="Section">
                <search-bar :hiddenSetting="true" @query="handleQuery" @reset="resetQuery" style="padding-left: 0;padding-right: 0;">
                    <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="150px">
                        <el-form-item label="企业类型" prop="scrType">
                            <el-select v-model="queryParams.scrType" placeholder="企业类型" clearable size="small" style="width: 215px">
                                <el-option v-for="dict in scrTypeOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-form>
                </search-bar>
                <el-table v-loading="loading" :data="relList" stripe>
                    <el-table-column label="序号" type="index" width="55" align="center" />
                    <el-table-column label="社会统一代码" align="center" prop="companyCode" show-overflow-tooltip>
                        <template slot-scope="scope">
                            <span v-if="scope.row.launch">{{scope.row.receiveScySocialCode}}</span>
                            <span v-else>{{scope.row.launchScySocialCode}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="企业名称" align="center" prop="companyName" show-overflow-tooltip>
                        <template slot-scope="scope">
                            <span v-if="scope.row.launch">{{scope.row.receiveScyName}}</span>
                            <span v-else>{{scope.row.launchScyName}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="企业类型" align="center" prop="companyType">
                        <template slot-scope="scope">
                            <span v-if="scope.row.launch">{{companyTypeFormat(scope.row.launchScrReceiveType)}}</span>
                            <span v-else>{{companyTypeFormat(scope.row.launchScrLaunchType)}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="联系人" align="center" prop="launchScrContarct">
                    </el-table-column>
                    <el-table-column label="联系电话" align="center" prop="launchScrContarctPhone">
                    </el-table-column>
                    <el-table-column label="邮箱" align="center" prop="launchScrContarctEmail" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column label="状态" align="center" prop="launchScrStatus" :formatter="launchScrStatusFormat">
                    </el-table-column>
                </el-table>

                <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getRelList" />
            </el-tab-pane>
            <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="dialogImageUrl" alt="">
            </el-dialog>
            <!--短信-->
            <el-dialog  :visible.sync="messageIsShow" width="800px"  append-to-body :before-close = "cancelMessage" center>
                <el-form ref="messageForm"  :disabled="false" :model="messageForm"  v-if="messageIsShow" label-width="150px"  class="demo-form-inline" :inline="true" @submit.native.prevent>
                        <el-form-item label="验证码" prop="validCode">
                            <el-input v-model="messageForm.validCode" style="width: 200px" maxlength="6"  oninput="value=value.replace(/[^\d]/g,'')"/>
                        </el-form-item>
                        <el-form-item>
                            <el-button  v-show="messShow"  type="success" @click="send">点击获取验证码</el-button>
                            <el-button v-show="!messShow" type="success" disabled><span>{{timer}}</span>秒后重新获取</el-button>
                        </el-form-item>

                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="checkCode">确定</el-button>
                    <el-button @click="cancelMessage">取 消</el-button>
                </div>
            </el-dialog>
        </el-tabs>
    </div>
</div>
</template>
<script>
import {
    companyQuery,listRel,sendMessage,checkCode
} from "@/api/service/companyInformation/companyInformation";
import { getToken } from "@/utils/auth";
import {getNowUser } from "@/api/system/user";
import SearchBar from '@/components/SearchBar/index.vue'
export default {
    name: "companyInformation",
    components: {SearchBar},
    data() {
        return {
            scyCfcaUserId:null,
            scyCfcaAuthNumber:null,
            dialogImageUrl: "",
            dialogVisible: false,
            companyType:null,
            //短信展示
            messageIsShow:false,
            //短信
            messageForm:{validCode:""},
            //控制短信验证码倒计时是否展示
            messShow:true,
            timer:60,
            cfcaNumber:null,
            // 遮罩层
            loading: true,
            form: {
                scyType: null,
            },
            noBtnImg: true,
            licenShow: false,
            showBtnImg: false,
            authorizationShow: false,
            commitmentShow: false,
            legalShow: false,
            legalBackShow: false,
            appendixShow: false,
            handlerNegativeShow: false,
            handlerPositiveShow: false,
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                scyId: null,
                companyName: null,
                scySocialCode: null,
                scrStatus: null,
                scrType: null,
            },
            total: 0,
            licenseFileList: [],
            legalFileList: [],
            legalBackFileList: [],
            authorizationFileList: [],
            commitmentFileList: [],
            handlerPositiveList: [],
            handlerNegativeList: [],
            relList: [],
            scyScaleOptions: [],
            scyOrganizationOptions: [],
            scyTypeOptions: [],
            scrStatusOptions: [],
            scrTypeOptions: [],
            contactsForm: {},
            invoiceForm: {},
            fileForm: {},
            activeName: "first",
        };
    },
    created() {
        this.getList();
        this.getRelList();
        this.getNowUser();
        this.getDicts("ser_scy_scale").then((response) => {
            this.scyScaleOptions = response.data;
        });
        this.getDicts("ser_scy_organization").then((response) => {
            this.scyOrganizationOptions = response.data;
        });
        this.getDicts("ser_scy_type").then((response) => {
            this.scyTypeOptions = response.data;
        });
        this.getDicts("sys_scr_type").then((response) => {
            this.scrTypeOptions = response.data;
        });
        this.getDicts("sys_scr_status").then((response) => {
            this.scrStatusOptions = response.data;
        });
    },
    mounted() {},
    methods: {
        /** 提交按钮 */
        // submitForm() {
        //     var self = this;
        //     this.$refs["form"].validate((valid) => {
        //         let fd = new FormData();
        //         for (var key in self.form) {
        //             fd.append(key, self.form[key]);
        //         }
        //         if (valid) {
        //             if (this.form.scyId != null) {
        //                 const loading = this.$loading({
        //                     lock: true,
        //                     text: "Loading",
        //                     spinner: "el-icon-loading",
        //                     background: "rgba(0, 0, 0, 0.9)",
        //                 });
        //                 updateCompanyInfor(self.form).then((response) => {
        //                     this.msgSuccess("修改成功");
        //                     this.created();
        //                 });
        //                 loading.close();
        //             }
        //         }
        //     });
        // },
        //取消按钮
        cancel() {
            (this.form.scyIndustry = null),
            (this.form.scyScale = null),
            (this.form.scyOrganization = null),
            (this.form.scyManager = null);
            this.$store.dispatch("tagsView/delView", this.$route);
            this.$router.go(-1);
        },
        /* 下载 */
        handleFilePreview(fileUrl) {
            this.$confirm('是否确认下载"' + fileUrl.name + '"附件?', "警告", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(function () {
                if (fileUrl.name.substr(-3) == "pdf") {
                    if (fileUrl.url.indexOf("getPdf") != -1) {
                        fileUrl.url = fileUrl.url.replace("getPdf", "getBytes");
                    }
                    window.open(fileUrl.url + "/" + getToken());
                } else {
                    var a = document.createElement("a");
                    var event = new MouseEvent("click");
                    a.download = fileUrl.name;
                    a.href = fileUrl.url + "/" + getToken();
                    a.dispatchEvent(event);
                }
            });
        },
        handlePictureCardPreview(file) {
            this.dialogImageUrl = file.url + "/" + getToken();
            this.dialogVisible = true;
        },
        handleImgDownload(file) {
            var a = document.createElement('a');
            var event = new MouseEvent('click');
            a.download = file.name;
            a.href = file.url+'/'+getToken();
            a.dispatchEvent(event);
            console.log(file)
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getRelList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        // 菜单状态字典翻译
        companyTypeFormat(companyType) {
            return this.selectDictLabel(this.scrTypeOptions, companyType);
        },
        scyTypeFormat(scyType) {
            return this.selectDictLabel(this.scyTypeOptions, scyType);
        },
        launchScrStatusFormat(row, column) {
            return this.selectDictLabel(
                this.scrStatusOptions,
                row.launchScrStatus
            );
        },
        openWindows(){
            this.messageIsShow = true;
        },
        //发送短信验证码
        send(){
            //发送
            sendMessage().then((response) => {
                debugger
                if(response.data){
                    //手机号
                    var newIphone = response.data.newIphone;
                    //结果
                    var result = response.data.result;
                    this.cfcaNumber = response.data.cfcaNumber;
                    this.messShow = false;
                    this.auth_timer = window.setInterval(() => {
                        this.messShow = false;
                        setTimeout(() => {
                                this.timer--;
                                if(this.timer <= 0 ){
                                    this.messShow = true;
                                    clearInterval(this.auth_timer);
                                }
                            }, 0)
                        },1000)
                    //成功
                    if("60000000" == result){
                        this.$message({
                            message: "已向经办人手机号为"+newIphone+"发送短信验证码,请注意查收",
                            type: 'warning'
                        });
                    }else{//失败
                        this.$message({
                            message: "短信发送失败",
                            type: 'warning'
                        });
                    }

                }
            });
        },
        //校验验证码是否正确
        checkCode(){
                if(!this.messageForm.validCode){
                        this.$message({
                            message: "请输入验证码",
                            type: 'warning'
                        });
                        return;
                }
                this.messageForm.cfcaNumber = this.cfcaNumber;
                //校验验证码
                checkCode(this.messageForm).then((response) => {
                    if(response.data){
                        //结果
                        var verification = response.data.verification;
                        //匹配
                        if("60000000" == verification){
                            this.messageIsShow = false;
                            //激活成功
                            this.getList()
                            // this.contractSigning();
                        }else{//不匹配
                            this.$message({
                                message: "验证有误,请重新输入",
                                type: 'warning'
                            });
                        }

                    }
            });
        },
        //关闭短信
        cancelMessage(){
            this.messageIsShow = false;
            this.resetMessage();
        },
        resetUpdate() {
        this.messShow = true;
        clearInterval(this.auth_timer);
        this.timer = 60;
        },
        resetMessage() {
            this.messageForm = {
                validCode:""
            };
            this.resetForm("messageForm");
        },
        //获取当前用户信息
        getNowUser() {
        getNowUser().then((response) => {
            this.companyType = response.data.companyType;
            console.log(response.data,"!!!!!!")
        });
        },       
        getList() {
            this.loading = true;
            companyQuery().then((response) => {
                //基本信息
                if (response.data.basicList.length > 0) {
                    this.form = response.data.basicList[0];
                    this.scyCfcaUserId = this.form.scyCfcaUserId;
                    if(response.data.basicList[0].scyCfcaAuthNumber){
                       this.scyCfcaAuthNumber = this.form.scyCfcaAuthNumber;
                    }
                    
                }
                //经办人信息
                if (response.data.contactsList) {
                    if (response.data.contactsList.length > 0) {
                        this.contactsForm = response.data.contactsList[0];
                    }
                }
                //发票信息
                if (response.data.invoiceList.length > 0) {
                    this.invoiceForm = response.data.invoiceList[0];
                }
                //营业执照信息
                if (response.data.licenseList) {
                    this.licenseFileList=[];
                    const licenseImg = response.data.licenseList[0].pfiUrl;
                    const licenseImgId = response.data.licenseList[0].pfiFileId;
                    if (licenseImg != "" && licenseImgId != "") {
                        this.licenShow = true;
                        let imgUrl = (licenseImg).split(",");
                        let imgUrlId = (licenseImgId).split(",");
                        for (let i = 0; i < imgUrl.length; i++) {
                            this.licenseFileList.push({url: imgUrl[i] + "/" + getToken(),uid: imgUrlId[i]});
                        }
                    } else {
                        this.licenShow = false;
                    }
                }
                //法人正面信息
                if (response.data.legalList) {
                    this.legalFileList = [];
                    const legalImg = response.data.legalList[0].pfiUrl;
                    const legalImgId = response.data.legalList[0].pfiFileId;
                    if (legalImg != "" && legalImgId != "") {
                        this.legalShow = true;
                        let imgUrl = (legalImg).split(",");
                        let imgUrlId = (legalImgId).split(",");
                        for (let i = 0; i < imgUrl.length; i++) {
                            this.legalFileList.push({
                                url: imgUrl[i] + "/" + getToken(),
                                uid: imgUrlId[i]
                            });
                        }
                        console.log(this.legalFileList,"营业执照")
                    } else {
                        this.legalShow = false;
                    }
                }
                //法人反面信息
                if (response.data.legalBackList) {
                    this.legalBackFileList = [];
                    const legalBackImg = response.data.legalBackList[0].pfiUrl;
                    const legalBackImgId =
                        response.data.legalBackList[0].pfiFileId;
                    if (legalBackImg != "" && legalBackImgId != "") {
                        this.legalBackShow = true;
                        let imgUrl = (legalBackImg).split(",");
                        let imgUrlId = (legalBackImgId).split(",");
                        for (let i = 0; i < imgUrl.length; i++) {
                            this.legalBackFileList.push({
                                url: imgUrl[i] + "/" + getToken(),
                                uid: imgUrlId[i]
                            });
                        }
                    } else {
                        this.legalBackShow = false;
                    }
                }
                //经办人正面信息
                if (response.data.handlerPositiveList) {
                    this.handlerPositiveList = [];
                    const handlerPositiveImg =
                        response.data.handlerPositiveList[0].pfiUrl;
                    const handlerPositiveImgId =
                        response.data.handlerPositiveList[0].pfiFileId;
                    if (handlerPositiveImg != "" && handlerPositiveId != "") {
                        this.handlerPositiveShow = true;
                        let imgUrl = (handlerPositiveImg).split(",");
                        let imgUrlId = (handlerPositiveImgId).split(",");
                        for (let i = 0; i < imgUrl.length; i++) {
                            this.handlerPositiveList.push({
                                url: imgUrl[i] + "/" + getToken(),
                                uid: imgUrlId[i]
                            });
                        }
                    } else {
                        this.handlerPositiveShow = false;
                    }
                }
                //经办人反面信息
                if (response.data.handlerNegativeList) {
                    this.handlerNegativeList = [];
                    const handlerNegativeImg =
                        response.data.handlerNegativeList[0].pfiUrl;
                    const handlerNegativeImgId =
                        response.data.handlerNegativeList[0].pfiFileId;
                    if (
                        handlerNegativeImg != "" &&
                        handlerNegativeImgId != ""
                    ) {
                        this.handlerNegativeShow = true;
                        let imgUrl = (handlerNegativeImg).split(",");
                        let imgUrlId = (handlerNegativeImgId).split(",");
                        for (let i = 0; i < imgUrl.length; i++) {
                            this.handlerNegativeList.push({
                                url: imgUrl[i] + "/" + getToken(),
                                uid: imgUrlId[i]
                            });
                        }
                    } else {
                        this.handlerNegativeShow = false;
                    }
                }
                //法人授权书信息
                if (response.data.authorizationList) {
                    this.authorizationFileList = [];
                    const authorizationFileName =
                        response.data.authorizationList[0].pfiFileName;
                    const authorizationFile =
                        response.data.authorizationList[0].pfiUrl;
                    const authorizationFileId =
                        response.data.authorizationList[0].pfiFileId;
                    if (authorizationFile != "" && authorizationFileId != "") {
                        this.authorizationShow = true;
                        let fileName = (authorizationFileName).split(",");
                        let fileUrl = (authorizationFile).split(",");
                        let fileUrlId = (authorizationFileId).split(",");
                        for (let i = 0; i < fileUrl.length; i++) {
                            this.authorizationFileList.push({
                                url: fileUrl[i] + "/" + getToken(),
                                uid: fileUrlId[i]
                            });
                        }
                    } else {
                        this.authorizationShow = false;
                    }
                }
                //数字证书授权与承诺书信息
                if (response.data.commitmentList) {
                    this.commitmentFileList = [];
                    const commitmentFileName =
                        response.data.commitmentList[0].pfiFileName;
                    const commitmentFile =
                        response.data.commitmentList[0].pfiUrl;
                    const commitmentFileId =
                        response.data.commitmentList[0].pfiFileId;
                    if (commitmentFile != "" && commitmentFileId != "") {
                        this.commitmentShow = true;
                        let fileName = (commitmentFileName).split(",");
                        let fileUrl = (commitmentFile).split(",");
                        let fileUrlId = (commitmentFileId).split(",");
                        for (let i = 0; i < fileUrl.length; i++) {
                            this.commitmentFileList.push({
                                url: fileUrl[i] + "/" + getToken(),
                                uid: fileUrlId[i]
                            });
                        }
                    } else {
                        this.commitmentShow = false;
                    }
                }
                //其他附件
                // if(response.data.appendixList){
                //     const appendixFileName = response.data.appendixList[0].pfiFileName;
                //     const appendixFile = response.data.appendixList[0].pfiUrl;
                //     const appendixFileId = response.data.appendixList[0].pfiFileId;
                //     if(appendixFile != '' && appendixFileId != ''){
                //         this.appendixShow = true;
                //         let fileName = (appendixFileName).split(",")
                //         let fileUrl =(appendixFile).split(",")
                //         let fileUrlId =(appendixFileId).split(",")
                //         for(let i = 0;i< fileUrl.length;i++){
                //         this.appendixFileList.push({name:fileName[i], url: fileUrl[i] + '/' + getToken(), uid: fileUrlId[i] });
                //         }
                //     }else{
                //         this.appendixShow = false;
                //     }
                // }
                this.loading = false;
            });
        },
        getRelList() {
            listRel(this.queryParams).then((response) => {
                let list = response.data.records;
                this.loginId = response.msg;
                for (let i = 0; i < list.length; i++) {
                    if (list[i].launchCompanyId == this.loginId) {
                        list[i].receive = false;
                        list[i].launch = true;
                    } else if (list[i].launchReceiveScrCompanyId == this.loginId) {
                        list[i].launch = false;
                        list[i].receive = true;
                    }
                }
                this.relList = list;
                this.total = response.data.total;
            });
        },
    },
};
</script>
<style lang="scss">
.uoloadSty .el-upload--picture-card {
    width: 110px;
    height: 110px;
    line-height: 110px;
}
.disUoloadSty .el-upload--picture-card {
    display: none;
}
.zap-business{
    display: flex;
    padding-bottom: 10px;
}
.zap-business__item{
    flex: 0 0 180px;
}
.zap-business__title{
    padding-top: 30px;
    padding-bottom: 16px;
    font-size: 14px;
    color: #333333;
}
.zap-business__picture{
    width: 182px;
    height: 182px;
    margin-right: 64px;
    border-radius: 4px;
    background-color: #F7F7F7;
    .el-upload-list--picture-card .el-upload-list__item{
        width: 182px;
        height: 182px;
        border: 1px solid #EBEBEB;
    }
}
.zap-business__text{
    margin-top: 40px;
    line-height: 20px;
    font-size: 14px;
    color: #333333;
    &:nth-of-type(1){
        margin-top: 30px;
    }
    &:nth-of-type(2){
        padding-bottom: 74px;
    }
}
</style>