<template>
<div>
  <el-button class="normal-margin" size="small" type="primary" @click="onShow">从媒体库选择</el-button>
  <el-dialog title="媒体库" append-to-body :visible.sync="dialogMediaVisible" width="90%" top="30px">
    <list ref="list" :accept="accept" @folderChecked="folderChecked" @toFolderDetail="toFolderDetail">
      <!-- <div slot="upload">
        <el-button v-if="clickHistory.length > 1" size="mini" type="text" icon="el-icon-back" @click="backFolder">返回上一级</el-button>
      </div> -->
    </list>
    <div class="dialog-footer">
      <el-button size="small" @click="dialogMediaVisible = false" class="normal-btn-width">取 消</el-button>
      <el-button :disabled="checklist.length !== 1" class="normal-btn-width" type="primary" size="small" @click="bindFileToData">确 定</el-button>
    </div>
  </el-dialog>
</div>
</template>

<script>
import list from './modules/list.vue'

export default {
  props:['bindData','accept'],
  components:{
    list
  },
  data () {
    return {
      dialogMediaVisible:false,
      showBtnGroup:false,
      folderid:'',
      checklist:[],
      clickHistory:[0]
    }
  },
  methods:{
    onShow () {
      this.dialogMediaVisible = true
      this.$emit('onShow')
    },
    
    // 监听文件选择
    folderChecked (arr) {
      this.checklist = arr
      if (arr.length > 0) {
        this.showBtnGroup = true
      } else {
        this.showBtnGroup = false
      }
    },
    // 监听打开文件夹
    toFolderDetail (id) {
      this.folderid = id
      this.clickHistory.push(id)
      console.log(this.folderid)
      this.$refs['list'].queryAttachment(id)
    },

    // 返回上层文件夹
    backFolder () {
      this.clickHistory.pop()
      this.$refs['list'].queryAttachment(this.clickHistory.at(-1))
    },
    async bindFileToData () {
      let obj = {attachmentids:[this.checklist[0].attachmentid]}
      obj = Object.assign({},obj,this.bindData)
      const res = await this.$api.requested({
        "classname": "system.attachment.Attachment",
        "method": "createFileLink",
        "content": obj
      })
      this.tool.showMessage(res,()=>{
        this.dialogMediaVisible = false
        this.$emit('onBindSuccess',{attinfos:JSON.stringify(res)})
      })
    },
  }
}

</script>
<style>
</style>