<template>
    <div class="edit-add-detail">
      <div class="crumbs">
        <Breadcrumb
          :breadcrumbOpt="breadcrumbOpt"
          svg-name="#icon-bill"
          @breadcrumb-click="handleClose"
        />
      </div>
      <div class="form-content">
        <div class="company-information">
          <el-form
            ref="formInfo"
            :model="parameter"
            label-position="right"
            label-width="auto"
          >
            <div class="rows">
              <div class="rows-left">
                <div class="rows-hr"></div>
              </div>
              <div class="rows-title">
                <div class="text-overflow">基本信息</div>
              </div>
            </div>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="管理单位">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.cardNo"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="供应商名称">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="供应商类型">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="供应商类别">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="分类目录">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="所属地区">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="账号状态">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="邮箱">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="供应商性质">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="parameter.clientName"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <div class="rows">
              <div class="rows-left">
                <div class="rows-hr"></div>
              </div>
              <div class="rows-title">
                <div class="text-overflow">供应商信息</div>
              </div>
            </div>
            <el-table
              ref="singleTable"
              :data="parameter.detail"
              style="width: 100%"
              highlight-current-row
              :cell-style="{'text-align': 'center'}"
              :header-cell-style="{'text-align': 'center'}"
            >
              <el-table-column fixed type="index" width="55" label="序号" />
              <el-table-column
                label="供应商编号"
                min-width="150"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="供应商名称"
                min-width="150"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="供应商性质"
                min-width="150"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="平台账号"
                min-width="170"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="账号状态"
                min-width="170"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="注册资本"
                min-width="170"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="联系人" min-width="150" prop="unloadAddress">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="邮箱" min-width="150" prop="unloadAddress">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="所属地区"
                min-width="180"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="供应商类型"
                min-width="180"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="分类目录"
                min-width="180"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="申请日期"
                min-width="180"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-date-picker
                    readonly="true"
                    v-model="scope.row.unloadAddress"
                    type="date"
                    value-format="yyyy-MM-dd"
                    style="width:100%;"
                  />
                </template>
              </el-table-column>
              <el-table-column label="A/B类" min-width="180" prop="unloadAddress">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="类别" min-width="180" prop="unloadAddress">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="停用操作人"
                min-width="180"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.unloadAddress"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="停用时间"
                min-width="180"
                prop="unloadAddress"
              >
                <template slot-scope="scope">
                  <el-date-picker
                    readonly="true"
                    v-model="scope.row.unloadAddress"
                    type="date"
                    value-format="yyyy-MM-dd"
                    style="width:100%;"
                  />
                </template>
              </el-table-column>
              <el-table-column label="拉黑原因" min-width="180" prop="type">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.type"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="移出审批状态" min-width="180" prop="type">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    clearable
                    v-model="scope.row.type"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column label="备注" min-width="180" prop="unloadAddress">
                <template slot-scope="scope">
                  <el-input
                    readonly="true"
                    v-model="scope.row.checkContent"
                    :rows="2"
                    maxlength="500"
                    show-word-limit
                    type="textarea"
                    style="width:100%;"
                  />
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import Breadcrumb from '@/components/Breadcrumb/index.vue'
  import utils from '@/utils.js'
  export default {
    name: 'inquiryContractDetail',
    components: {Breadcrumb},
    data() {
      return {
        breadcrumbOpt: [{breadcrumbName: '合同前不执行'}, {breadcrumbName: '详情'}],
        parameter: {}
      }
    },
    created() {
      this.parameter = this.$route.query.detailRows
      console.log(this.parameter)
    },
    mounted() {},
    methods: {
      // 关闭//面包屑点击
      handleClose() {
        this.$router.push({
          name: 'notExecuted',
          params: {
            pageBean: this.$route.query.pageBean,
            tabsActiveName: 'conSingle',
          }
        })
        this.parameter = {}
      },
      //详情
      detail(val) {
        if (val) {
          this.modifychoData(val)
        }
      },
      //获取详情
      modifychoData(val) {}
    }
  }
  </script>
  <style lang="scss" scoped>
  ::v-deep .el-form-item__label {
    width: 120px;
    font-size: 14px;
    color: #828282;
    font-weight: 500;
  }
  
  ::v-deep .el-form-item__content span {
    font-size: 14px;
    color: #000;
    font-weight: 500;
  }
  
  ::v-deep .el-form-item {
    margin-bottom: 10px;
  }
  .rows {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 16px;
    padding: 10px 0;
  
    .rows-left {
      margin-right: 10px;
  
      .rows-hr {
        width: 3px;
        height: 18px;
        background-color: #0e6eff;
        border-radius: 2px;
      }
    }
  
    .rows-title {
      .text-overflow {
        width: 100%;
        font-size: 16px;
      }
    }
  }
  </style>
  