<template>
  <span @click.stop="clickFun">
    <template v-if="typeof item.format === 'function'">
      <span v-html="item.format(row, index, item.prop, item)"></span>
    </template>
    <template v-else>
      <!-- dic:再次调用接口获取值 -->
      <template v-if="item.format == 'dic'"></template>
      <!-- enum:枚举展示值 -->
      <template v-else-if="item.format == 'enum' && item.enum">
        {{ item.enum[row[item.prop]] }}
      </template>
      <!-- money:金钱展示值 -->
      <template v-else-if="item.format == 'money'">
        <!-- {{ $filters.moneyFormat(row[item.prop]) }} -->
      </template>
      <!-- date:日期展示 -->
      <template v-else-if="item.format == 'date'">
        <!-- {{ $filters.dateTimeFormat(row[item.prop]) }} -->
      </template>
      <!-- timeStamp:时间戳转日期展示 -->
      <template v-else-if="item.format == 'timeStamp'">
        <!-- {{ $filters.timeStampFormat(row[item.prop]) }} -->
      </template>
      <!-- link:超链接 -->
      <template
        v-else-if="item.format == 'link' && row[item.prop]?.includes('http')"
      >
        <el-link
          :href="item.isLink || row[item.prop]"
          target="_blank"
          @click.stop="() => {}"
        >
          {{ row[item.prop] }}
        </el-link>
      </template>
      <!-- 普通文字字段展示 -->
      <template v-else>
        {{ row[item.prop] }}
      </template>
    </template>
  </span>
</template>

<script>
import { getCurrentInstance } from "vue";
export default {
  name: "formatText",
  props: {
    item: {
      type: Object,
      default: () => {},
    },
    row: {
      type: Object,
      default: () => {},
    },
    index: {
      type: [Number, String],
      default: 0,
    },
  },
  emits: ["click"],
  setup(props, { ctx }) {
    const { item, row } = props;
    let { proxy } = getCurrentInstance();
    function clickFun() {
      proxy.$emit("click");
    }
    return { clickFun };
  },
};
</script>
