<!--
 * @Author: your name
 * @Date: 2021-05-19 11:39:21
 * @LastEditTime: 2021-05-19 14:15:46
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \ESB\src\components\resourceShowFile\index.vue
-->
<template>
  <div>
    <el-dialog :close-on-click-modal="false" title="资源文件" :visible.sync="dialogVisible" width="910px" top="5vh" append-to-body>
      <!-- <el-form :model="formData" label-width="50px" @submit.native.prevent>
        <div class="search-header">
          <div class="tool-common-wrap">
            <div class="search-wrap">
              <quick-query ref="quick" :placeholder="placeholder" :is-date="false" @quickSearch="powerSearch" />
            </div>
            <div class="btn-wrap">
              <el-button type="primary" @click="rest()" > 刷新 </el-button>
            </div>
          </div>
        </div>
      </el-form> -->
      <div class="tableWrap">
        <el-table
          :data="tableList"
          v-loading="tableLoading"
          highlight-current-row
          style="width: 100%; margin-bottom: 10px"
          size="mini"
          ref="multipleTable"
          tooltip-effect="dark"
          row-key="id"
          :reserve-selection="true"
          @selection-change="handleSelectionChange">
          <el-table-column prop="name" label="名称" align="left" show-overflow-tooltip>
            <template slot-scope="scope">
              <a @click="openDatal(scope.row)" style="color:#2d42af">{{ scope.row.name }}</a>
            </template>
          </el-table-column>
          <el-table-column prop="path" label="路径" align="left" show-overflow-tooltip>
          </el-table-column>
          <el-table-column prop="type" label="类型" align="center" show-overflow-tooltip>
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>
    <el-dialog :close-on-click-modal="false" title="资源文件信息" :visible.sync="dialogFormVisible" :destroy-on-close="true" append-to-body width="72%">
      <resource-info v-model="dialogFormVisible" :currentRow="currentRow" @confirm="handleSubmit()" />
    </el-dialog>
  </div>
</template>

<script>
import { getResourceFile } from '@/api/esb_service'
import ResourceInfo from '@/views/esb_service/resource_file/ResourceInfo'

export default {
  name: 'ChooseGoodsDialog',
  components: {
    ResourceInfo
  },
  data() {
    return {
      currentRow: {}, // 存储sqlid
      dialogFormVisible: false,
      dialogVisible: false,
      tableLoading: false,
      projectNames: {},
      formData: {},
      tableList: [],
      page: {
        pageSize: 5,
        pageNum: 1,
        total: 0
      },
      selectIndex: -1,
      multipleSelection: [],
      defineFileTypeList: [
        { name: 'wsdl', value: 'wsdl' },
        { name: 'XML Schema', value: 'XML Schema' },
        { name: 'JSON Schema', value: 'JSON Schema' }
      ],
      projectId: localStorage.getItem('projectID'),
      filters: [
        {
          key: 'project_id',
          opt: 'LIKE',
          type: 'S',
          value: this.projectId
        }
      ],
      currentId: '',
      quickQueryKeys: ['name'],
      sort: {
        orderby: 'createon',
        sort: 'desc'
      },
      placeholder: '名称、描述',
      logic: 'and',
      sected: ''
    }
  },
  props: {
    porjectId: {
      type: String,
      default: ''
    },
    sqlId: {
      type: String,
      default: ''
    },
    value: {
      type: Boolean,
      default: false
    }
  },
  watch: {
    sqlId(val) {
      console.log(val, '查看一下 id1111')
    },
    porjectId(val) {
      console.log(val, '查看一下 i11d')
    },
    value(val) {
      this.dialogVisible = val
      if (val) {
        this.prduceFileShow(this.sqlId, this.porjectId)
      }
    },
    dialogVisible(val) {
      this.$emit('input', val)
    }
  },
  methods: {
    openDatal(val) {
      this.dialogFormVisible = true
      this.currentRow = val
    },
    // getData () {
    //   this.tableLoading = true
    //   this.selectIndex = -1
    //   listFiles({
    //     logic: this.logic,
    //     filters: this.filters,
    //     ...this.sort,
    //     ...this.page
    //   }).then((rt) => {
    //     this.tableLoading = false
    //     if (rt.status === '200') {
    //       console.log(this.tableList, '查看路径')
    //       this.tableList = rt.data.list || []
    //       this.tableList.forEach((item, index) => {
    //         if (this.currentId && this.currentId === item.id) {
    //           this.selectIndex = index
    //         }
    //       })
    //       this.page.total = rt.data.total
    //     }
    //   }).catch(() => {
    //     this.tableLoading = false
    //   })
    // },
    // 展示产品地址
    prduceFileShow(id, pid) {
      this.tableLoading = true
      this.selectIndex = -1
      getResourceFile(id, pid).then(res => {
        this.tableLoading = false
        this.tableList = res.data || []
        this.page.total = res.data.total
        console.log(res, '1')
      }).catch(() => {
        this.tableLoading = false
      })
    },
    // 搜索
    // 重置
    // 搜索过滤
    // 单选
    handleCurrentChange(val) {
      if (val) {
        this.currentId = ''
        this.selectIndex = this.tableList.findIndex(item => item.id === val.id)
      }
    },
    // 多选
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    // 关闭dialog
    cancel() {
      this.dialogVisible = false
    }
  }
}
</script>

<style scoped>
</style>
