<template>
  <div class="dg-cardtxt">
    <template v-for="(item, index) in propData">
      <el-col :key="index" :span="6" class="r_m_b_10 my-el-card" @dblclick.native="cardtxtDataSource(item)">
        <el-row class="m_h100 my_cb_row">
          <el-col :span="12" :offset="12">
            <img
              :src="`/meta/static/original/${$styleVars.themeImgType}/dg_wendang_86.png`"
              style="width: 30px; height: 30px; margin-left: -10px"
            />
          </el-col>
          <el-col :span="24" class="r_m_b_10" style="height: 52px; text-align: center">
            <el-col :span="24" class="tn_overflow fz_14" :title="initObjectMap(item).cnName">
              <span class="card_title fw_400">{{ initObjectMap(item).cnName }}</span>
            </el-col>
            <el-col :span="24" class="tn_overflow fz_14" :title="initObjectMap(item).info">
              <span>{{ initObjectMap(item).info }}</span>
            </el-col>
            <el-col id="iconBtn" :span="24" class="tn_overflow fz_14" :title="initObjectMap(item).info">
              <template v-for="(action, index) in actionBtns">
                <el-button
                  v-if="(!action.judge || action.judge(item)) && action.ACTTYPE == 'action'"
                  :key="index"
                  :title="action.title"
                  :icon="action.icon"
                  type="text"
                  circle
                  plain
                  @click="cardtxtClickHandle(item, action, $event)"
                ></el-button>
              </template>
            </el-col>
          </el-col>
        </el-row>
      </el-col>
    </template>
  </div>
</template>

<script>
export default {
  name: 'DgCardtxt',
  props: {
    cardtxtData: {
      type: Array,
      default() {
        return []
      },
    },
    actionBtns: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      propData: [],
    }
  },
  // 数据改变监听事件
  watch: {
    cardtxtData(val) {
      this.propData = val
    },
  },
  created() {
    if (this.cardtxtData.length) this.propData = this.cardtxtData
  },
  methods: {
    initObjectMap(data) {
      let objectMap = {}
      switch (data.OBJ_TYPE) {
        case 'COLUMN':
          objectMap = {
            name: data.COL_NAME,
            cnName: data.COL_CNNAME,
            info: `${data.DB_NAME}/${data.SCHEMA_NAME}/${data.OBJ_NAME}`,
            remark: data.REMARK,
          }
          break

        default:
          objectMap = {
            name: data.OBJ_NAME,
            cnName: data.OBJ_CNNAME,
            info: `${data.DB_NAME}/${data.SCHEMA_NAME}`,
            remark: data.REMARK,
          }
          break
      }
      return objectMap
    },
    cardtxtClickHandle(row, action, event) {
      if (action.fn) {
        this.$emit('buttonClick', row, action, event)
      }
    },
  },
}
</script>
