<template>
  <el-card title="表格选择器">
    <div slot="header" class="clearfix">
      <span>表格选择器</span>
    </div>
    <div>
      <el-form>
        <el-form-item label="表格选择器">
          <ed-input-table v-model="dataValue" :action="action" :columns="columns" :headers="headers"
                          :method="method" :params="params">
          </ed-input-table>
        </el-form-item>
        <el-form-item label="当前选中值">
          <p>{{ dataValue }}</p>
        </el-form-item>
      </el-form>
    </div>
  </el-card>
</template>

<script>
export default {
  name: "InputTable",
  data() {
    return {
      dataValue: [],
      columns: [],
      action: this.$EdFrame.BASE_API + '/admin-api/easydata/dict/getDictList',
      headers: this.$EdFrame.BASE_HEADERS(),
      method: "get",
      params: {type: ''}
    }
  },
  watch: {
    dataValue(n) {
      console.log(n)
    },

  },
  mounted() {
    this.getcolumns()
    this.getDataValue()
  },
  methods: {
    getDataValue(){
      setTimeout(()=>{
        let Value = [
          {
            "name": "参数类型",
            "dictType": "infra_config_type",
            "description": null,
            "sort": null,
            "usable": true
          },
          {
            "name": "通知类型",
            "dictType": "system_notice_type",
            "description": null,
            "sort": null,
            "usable": true
          }
        ]

        // this.dataValue = Value
        this.dataValue = Value[1]
      },1000)
    },
    getcolumns(){
      setTimeout(()=>{
        this.columns = [
          {
            "label": "字段名称",
            "prop": "name",
            rowKey: true,
          },
          {
            "label": "字段类型",
            "prop": "dictType",
            "map": "type",
            "query": true,
            rowKey: false,
          },
          {
            "label": "状态",
            "prop": "usable",
            "formatter": "function initUsable(row, column, cellValue, index){return cellValue === true ? '可用1' : '不可用'}"
          }
        ]
      },2000)
    },
    formatter(row, column, cellValue, index) {
      let func = `function initUsable(row, column, cellValue, index){return cellValue === true ? "可用" : "不可用"}`
      let funcTest = new Function('return ' + func)();
      return funcTest(row, column, cellValue, index)
    }

  }
}
</script>

<style scoped>

</style>
