<template>
  <table class="sd-form-table">
    <tr>
      <sd-form-item-td name="destColumn$Src">
        <sd-field-picker
          v-model="model.destColumn$Src"
          :form-id="destFormId"
          :disabled-keys="getConfiguredIds()"
          :disabled-types="['OpinionView']"
          :type="model.srcColumn?.[0]?.type"
          @change="
            (v) => {
              model.destColumn = v?.[0]?.id
              // 还原 变更模式和去除重复的设置
              model.mode = fields.mode.attr.defaultValue
              model.validateRepeat = fields.validateRepeat.attr.defaultValue
            }
          "
        />
      </sd-form-item-td>
    </tr>
    <tr>
      <sd-form-item-td
        name="opType"
        @change="
          () => {
            model.value = undefined
            model.srcColumn = undefined
            model.formulaFD = undefined
          }
        "
      />
    </tr>
    <tr>
      <sd-form-item-td name="value">
        <!-- 公式 -->
        <sd-formula-compute
          v-if="model.opType === 'formula'"
          v-model="model.formulaFD"
          :load-fields="loadFormulaFields"
          :data-type="model.destColumn$Src?.[0]?.type || undefined"
          :constants="constants"
          value-string
          @update="
            ($event) => {
              $set(model, 'value', $event)
            }
          "
        />
      </sd-form-item-td>
    </tr>
    <tr>
      <!-- 赋表单值 -->
      <sd-form-item-td name="srcColumn" label="值">
        <sd-field-picker
          v-model="model.srcColumn"
          :form-id="srcFormId"
          :type="model.destColumn$Src?.[0]?.type"
          :disabled-types="['OpinionView']"
          @change="
            (v) => {
              model.value = v?.[0]?.id
            }
          "
        />
      </sd-form-item-td>
    </tr>
    <tr>
      <!-- 数据更新模式显示：目标表单字段是高级字段（人员或部门）或 子表 -->
      <sd-form-item-td
        v-if="
          ['user', 'group'].includes(model.destColumn$Src?.[0]?.type) ||
            model.destColumn?.indexOf('.') > -1
        "
        name="mode"
      />
    </tr>
    <tr>
      <sd-form-item-td name="validateRepeat" />
    </tr>
  </table>
</template>

<script>
import components from './_import-components/sd-fields-map-form-import'

export default {
  name: 'SdFieldsMapForm',
  components,
  props: {
    model: {
      type: Object,
      default: () => {},
    },
    fields: {
      type: Object,
      default: () => {},
    },
    destFormId: {
      type: String,
      default: '',
    },
    srcFormId: {
      type: String,
      default: '',
    },
    loadFormulaFields: {
      type: Function,
      default: undefined,
    },
    getConfiguredFields: {
      type: Function,
      default: undefined,
    },
    constants: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {}
  },
  methods: {
    getConfiguredIds() {
      return (this.getConfiguredFields?.() || [])
        .concat(['id'])
        .filter((i) => i !== this.fields.destColumn.value)
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
</style>
