<template>
    <div style="overflow-y: auto;">
        <div class="common-card">
            <h3>审批进度</h3>
            <yl-step></yl-step>
        </div>
        <div class="common-card">
            <h3>工商信息</h3>
            <div class="right-type" style="top:13px;">
                <span style="color: rgba(60,100,220,1);font-weight: 700;">国药控股山西长治有限公司</span>
            </div>
            <el-form :model="infoForm" ref="infoform" label-width="237px" class="grid-form-class">
            <div class="form-body">
            <div class="flex-css">
                <el-form-item label="统一社会信用代码" prop="uscc">
                    <div class="content">
                        {{ infoForm.uscc }}
                    </div>
                </el-form-item>
                <el-form-item label="法定代表人" prop="legrepName">
                    <div class="content">
                        {{ infoForm.legrepName }}
                    </div>
                </el-form-item>
                <el-form-item label="登记状态" prop="regStas">
                    <div class="content">
                        {{ infoForm.regStas }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="成立日期" prop="estbdat">
                    <div class="content">
                        {{ infoForm.estbdat }}
                    </div>
                </el-form-item>
                <el-form-item label="国标行业" prop="natstdIndu">
                    <div class="content">
                        {{ infoForm.natstdIndu }}
                    </div>
                </el-form-item>
                <el-form-item label="注册资本" prop="regCapt">
                    <div class="content">
                        {{ infoForm.regCapt }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="实缴资本" prop="arrCapt">
                    <div class="content">
                        {{ infoForm.arrCapt }}
                    </div>
                </el-form-item>
                <el-form-item label="组织机构代码" prop="orgCode">
                    <div class="content">
                        {{ infoForm.orgCode }}
                    </div>
                </el-form-item>
                <el-form-item label="工商注册号" prop="bizRegno">
                    <div class="content">
                        {{ infoForm.bizRegno }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="纳税人识别号" prop="tin">
                    <div class="content">
                        {{ infoForm.tin }}
                    </div>
                </el-form-item>
                <el-form-item label="企业类型" prop="entpType">
                    <div class="content">
                        {{ infoForm.entpType }}
                    </div>
                </el-form-item>
                <el-form-item label="营业期限" prop="bizDdln">
                    <div class="content">
                        {{ infoForm.bizDdln }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="纳税人资质" prop="txperCert">
                    <div class="content">
                        {{ infoForm.txperCert }}
                    </div>
                </el-form-item>
                <el-form-item label="所属地区" prop="regn">
                    <div class="content">
                        {{ infoForm.regn }}
                    </div>
                </el-form-item>
                <el-form-item label="登记机关" prop="regOrg">
                    <div class="content">
                        {{ infoForm.regOrg }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="注册地址" prop="regAddrName">
                    <div class="content">
                        {{ infoForm.regAddrName }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="经营范围" prop="bizScp">
                    <div class="content">
                        {{ infoForm.bizScp }}
                    </div>
                </el-form-item>
            </div>
            </div>
            </el-form>
        </div>
        <div class="common-card">
            <h3>联系人信息</h3>
            <el-form :model="infoForm" ref="contantform" label-width="237px" class="grid-form-class">
            <div class="form-body">
            <div class="flex-css">
                <el-form-item label="联系人" prop="conerName">
                    <div class="content">
                        {{ infoForm.conerName }}
                    </div>
                </el-form-item>
                <el-form-item label="职务" prop="duty">
                    <div class="content">
                        {{ infoForm.duty }}
                    </div>
                </el-form-item>
            </div>
            <div class="flex-css">
                <el-form-item label="联系电话" prop="tel">
                    <div class="content">
                        {{ infoForm.tel }}
                    </div>
                </el-form-item>
                <el-form-item label="电子邮箱" prop="email">
                    <div class="content">
                        {{ infoForm.email }}
                    </div>
                </el-form-item>
            </div>
            </div>
            </el-form>
        </div>
        <div class="common-card">
            <h3>经营资质</h3>
            <el-table
                v-loading="tableLoading"
                element-loading-text="加载中"
                :data="tableData"
                fit
                stripe
                border
            >
                <template slot="empty">
                    <img src="@/assets/nopage.png" alt />
                    <p>暂无数据</p>
                </template>
                <el-table-column fixed type="index" label="序号" width="60"/>
                <el-table-column label="证书名称" prop="quaName" />
                <el-table-column label="证书编号" prop="quaCode" />
                <el-table-column label="发证日期" prop="issuDate" />
                <el-table-column label="截至日期" prop="endDate" />
                <el-table-column label="资质文件" prop="fileId" width="150">
                    <template slot-scope="scope">
                        <yl-upload
                            :fileId="scope.row.fileId"
                            readonly
                            v-if="scope.row.fileId"
                        >
                        </yl-upload>
                    </template>
                </el-table-column>
            </el-table>
            <div class="foot-button" style="margin:30px 0 20px;" v-if="isShow">
                <el-button type="primary" @click="handlePass" :loading="ppLoad">通过</el-button>
                <el-button type="danger" @click="handleNoPass" :loading="nnLoad">驳回</el-button>
            </div>
        </div>
    </div>
</template>

<script>
import ylStep from "@/components/yl-step";
import { getSplerInfo } from "@/api/supplierManage/index";
import { apprSplerInfo } from "@/api/approve/index";
import ylUpload from "@/components/yl-upload";
    export default {
        components:{
            ylStep,ylUpload
        },
        data() {
            return {
                pdfSrc: "",
                dialogVisible: false,
                infoForm:{},
                tableLoading: false,
                tableData: [],
                ppLoad: false,
                nnLoad: false,
                isShow: false,
                reason: "",
            }
        },
        created () {
            if(this.$route.query.stas == "待审核"){
                this.isShow = true;
            }else{
                this.isShow = false;
            }
        },
        mounted () {
            this.getData();
        },
        methods: {
            getData() {
                this.tableLoading = true;
                getSplerInfo({splerId:this.$route.query.sourceId}).then((res) => {
                    this.infoForm = res.data;
                    this.tableData = res.data.quaList;
                    this.tableLoading = false;
                })
                .catch((err) => {
                    this.tableLoading = false;
                });
            },
            // 通过
            handlePass() {
                this.$confirm("确认通过", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                }).then(() => {
                    this.ppLoad = true;
                    let data = {
                        apprStas: "Y",
                        id: this.$route.query.sourceId
                    }
                    apprSplerInfo(data).then((res) => {
                        this.ppLoad = false;
                        this.$router.push('approveA')
                    })
                    .catch((err) => {
                        this.ppLoad = false;
                    });
                })
            },
            // 驳回
            handleNoPass() {
                this.$prompt("请输入驳回原因", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                    inputValidator: (value) => {
                    if (!value) {
                        return "驳回原因不能为空";
                    } else {
                        this.reason = value;
                    }
                    },
                }).then(() => {
                    this.nnLoad = true;
                    let data = {
                        apprStas: "R",
                        id: this.$route.query.sourceId,
                        reason: this.reason
                    }
                    apprSplerInfo(data).then((res) => {
                        this.nnLoad = false;
                        this.$router.push('approveA')
                    })
                    .catch((err) => {
                        this.nnLoad = false;
                    });
                })
            }
        },
    }
</script>

<style lang="scss" scoped>
::v-deep .dd .el-dialog {
  height: 90%;
  margin-top: 30px !important;
}
::v-deep .dd .el-dialog__body {
  height: 90%;
  padding: 0 25px 0px;
}
</style>