<template>
  <div class="EditDetail">
    <a-spin style="width:100%;min-height:200px;" :spinning="!isReady">
      <div class="btngroup">
        <p-button style="float:left" @click="toBack">返回</p-button>
        <!-- <p-button style="float:right" @click="submitbtn">保存</p-button> -->
      </div>

      <!-- <a-card title="选择货主和仓库" style="width: 100%;margin-bottom:20px">
        <p-grid-form ref="CargoownerWH" :items="custom" />
      </a-card> -->

      <div style="background:#fff">
        <a-card title="新增仓客户关系" style="width: 100%">
          <!-- <div slot="extra">
                  <p-button @click="createrowHealthScope">新增</p-button>
                  <p-button @click="delHealthScope">删除</p-button>
                </div> -->
          <!-- <p-table
            rowKey="scopeType1"
            :columns="HealthScopecolumns"
            :selectedRowKeys.sync="HealthScopelList"
            :data-source="HealthScopedata"
            :autoLoad="false"
            :bordered="true"
            :filterDropdownColum="false"
            :colorTransformRow="false"
            ref="healthScope"
          /> -->

          <a-descriptions title="详情" bordered>
            <a-descriptions-item
              v-for="item of columns.filter(t => !t.hidden && t.key != 'operator' && t.dataIndex != '_row_count')"
              :key="item.key"
              :label="item.title"
            >
              {{ detailData[item.key] }}
            </a-descriptions-item>
          </a-descriptions>
        </a-card>
      </div>
    </a-spin>
  </div>
</template>

<script>
import pick from 'lodash.pick'
import custom from './config/custom'
import TableEdit from './tableedit'
// import API from './api/cargoowner'
import API from './api/api'
const HealthScopedata = [
  {
    scopeType1: '1111',
    scopeType2: '11111',
    scopeType3: '111111',
    scopeType4: '111111',
    scopeType5: '1111111',
    scopeType6: '1111111',
    scopeType7: '111111111'
  },
  {
    scopeType1: '11211',
    scopeType2: '113311',
    scopeType3: '1133411',
    scopeType4: '112211',
    scopeType5: '1112111',
    scopeType6: '1112111',
    scopeType7: '1111'
  },
  {
    scopeType1: '1125111',
    scopeType2: '1151211',
    scopeType3: '1115211',
    scopeType4: '1125111',
    scopeType5: '11145211',
    scopeType6: '1115211',
    scopeType7: '1115211'
  }
]
export default {
  name: 'detail-page',
  props: {
    data: {
      type: Array,
      default: null,
      active: ''
    },
    detailItem: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      isReady: true,
      required: false,
      HealthScopelList: [],
      HealthLicenseList: [],
      tableRemoteUrl: API.info,
      info: {},
      remoteParams: {},
      custom: custom.custom, //货主资料gridform配置
      // Healthcustom: custom.Healthcustom, //Health 业务范围 三证合一配置
      HealthScopecolumns: custom.HealthScopecolumns, //经营范围字段
      HealthLicensecolumns: custom.HealthLicensecolumns, //证件资料字段
      HealthScopedata: HealthScopedata, //经营范围数据
      HealthLicensedata: [], //证件资料
      tabs: ['医药', '制造', '商贸', '拓展'],
      cargoownerinfo: {}, //货主详细信息
      info: {},
      list: [],
      type: '',
      key: 'tab1',
      noTitleKey: 'app'
    }
  },

  components: {
    TableEdit
  },
  mounted() {
    console.log('详情页')
    // this.setvalue()
    this.getdetail()
  },

  methods: {
    toBack() {
      this.$emit('changeStep', { step: 1, item: null })
    },
    //获取仓库和货主数据
    getCargoownerWH() {
      this.$refs.CargoownerWH.form.validateFields((err, value) => {
        if (!err) {
          // this.required = true
          console.log(value)
          return value
        }
      })
    },
    async getdetail() {
      let that = this

      // this.remoteParams = {
      //   id: that.detailItem.drId
      // }

      let data = {
        id: that.detailItem.drId
      }
      let res = await API.infos(data)
      console.log(res)
      this.info = res.data
    }
  }
}
</script>

<style lang="less">
.EditDetail {
  .btngroup {
    width: 100%;
    height: 40px;
  }
  .tabs {
    min-height: 300px;
  }
  .table-operator {
    color: #2b80ff;
    cursor: pointer;
  }
  .table-operator:hover {
    text-decoration: underline;
  }
}
</style>
