<!--
 * @Author: zhp
 * @Date: 2023-04-18 09:19:02
 * @LastEditTime: 2023-04-18 14:24:53
 * @LastEditors: zhp
 * @Description: 
-->
<template>
  <el-popover placement="right" width="400" trigger="click">
    <base-table id="palletTable" :table-props="tableProps" ref="palletTable1"
      :table-data="tableData" >
    </base-table>
    <i slot="reference" class="el-icon-plus" @click="showInnerTable(injectData.id)"/>
  </el-popover>
</template>
<script>
import i18n from "@/i18n"
const tableProps = [
  {
    prop: "contact",
    label: i18n.t('supplier.contact'),
  },
  {
    prop: "contactEmail",
    label: i18n.t('supplier.contactEmail')
  },
  {
    prop: "contactPhone",
    label: i18n.t('supplier.contactPhone')
  },
  {
    prop: "enterpriseNature",
    label: i18n.t('supplier.enterpriseNature')
  },
  {
    prop: "industry",
    label: i18n.t('supplier.industry')
  },
  {
    prop: "productService",
    label: i18n.t('supplier.productService')
  }
];
export default {
  name: 'InnerTable',
  props: {
    injectData: {
      type: Object,
      default: () => ({})
    },
    itemProp: {
      type: String
    }
  },
  data() {
    return {
      tableProps,
      list: this.injectData,
      tableData: []
    }
  },
  methods: {
    showInnerTable(id) {
      console.log(id)
      this.tableData = [
        {
          contact: this.injectData.contact,
          contactEmail: this.injectData.contactEmail,
          contactPhone: this.injectData.contactPhone,
          enterpriseNature: this.injectData.enterpriseNature,
          industry: this.injectData.industry,
          productService: this.injectData.productService
        }
      ]
    }
  }
}
</script>
