<template>
  <div>
    <div class="my-tabs">
      <el-tabs v-model="activeName" type="card">
        <el-tab-pane v-for="(tab,index) in tabs" :key="index" :label="tab" :name="'tab' + index"></el-tab-pane>
        <el-tab-pane label="附件" name="file"></el-tab-pane>
        <el-tab-pane label="操作记录" name="log"></el-tab-pane>
      </el-tabs>
    </div>

    <div v-show="'tab'+index === activeName" v-for="(item,index) in tabs" :key="index">
      <slot :name="'slot' + index"></slot>
    </div>

    <div class="container normal-panel" v-show="activeName === 'file'">
      <attachmentList :attinfos="attinfo_attachment" @onSuccess="queryAttments">
        <upload slot="upload" :folderid="folderid"
          :bindData="{ ownertable: idname.slice(0, idname.length - 2), ownerid: editData[idname], usetype: 'default' }"
          @onSuccess="queryAttments"></upload>
      </attachmentList>
    </div>
  </div>
</template>

<script>
import attachmentList from '@/components/attachment_list/index.vue'
import upload from '@/components/upload/hw_obs_upload.vue'

export default {
  props:['tabs','editData','idname'],
  components:{
    attachmentList,
    upload
  },
  data () {
    return {
      activeName:'tab0',
      attinfo_attachment:[],
      folderid:JSON.parse(sessionStorage.getItem('folderid')).appfolderid,
    }
  },
  methods:{
    async queryAttments () {
      const res = await this.$api.requested({
        "classname": "system.attachment.Attachment",
        "method": "queryFileLink",
        "content": {
          "ownertable": this.idname.slice(0, this.idname.length - 2),
          "ownerid": this.editData[this.idname],
          "usetype":""
        }
      })
      this.attinfo_attachment = res.data
    }
  },
  watch: {
    editData () {
      this.queryAttments()
    }
  },
}

</script>
<style>
</style>