<template>
  <!-- 值 -->
  <span v-if="type === 'value'">
    <!-- 公式赋值 -->
    <span v-if="record.opType === 'formula'">
      <sd-formula
        v-if="text"
        :class="[$style.formula, $style.column]"
        :formulas="[]"
        :fields="[]"
        :value="JSON.parse(record.formulaFD)"
      />
    </span>
    <!-- 赋表单值 -->
    <span v-else-if="record.opType === 'direct' && record.srcColumn">
      字段：{{ JSON.parse(record.srcColumn || '[{}]')[0].name || '' }}
    </span>
    <span v-else>{{ text }}</span>
  </span>
  <!-- 数据变更模式 -->
  <span v-else-if="type === 'mode'">
    {{ text === 'update' ? '变更' : text === 'insert' ? '新增' : '' }}
  </span>
  <!-- 去除重复 -->
  <span v-else-if="type === 'repeat'">
    {{ record.mode === 'insert' ? (text === '1' ? '是' : text === '0' ? '否' : '') : '' }}
  </span>
  <!-- 表单字段 -->
  <span v-else-if="type === 'destColumn'">
    {{ JSON.parse(text || '[{}]')[0].name || '' }}
  </span>
</template>

<script>
import sdFormula from '@/form-designer/sd-formula.vue'
import components from './_import-components/sd-value-display-import'

export default {
  name: 'SdValueDisplay',
  components: {
    ...components,
    sdFormula,
  },
  props: {
    record: {
      type: Object,
      required: true,
    },
    text: {
      type: String,
      default: '',
    },
    type: {
      type: String,
      default: 'value',
    },
  },
  data() {
    return {}
  },
  methods: {},
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.formula {
  line-height: 1;
  pointer-events: none;
  &.column {
    line-height: 1;
    > span {
      overflow: hidden;
    }
    span:global(.ant-tag) {
      margin: 0;
      white-space: normal;
    }
  }
  > span {
    padding: 0;
  }
}
</style>
