<template>
  <div v-if="formConfig.currentItem.componentCode == 'table'">
    <a-form-item label="选择子表:">
      <a-select
        v-model:value="formConfig.currentItem.formItemTable.subMetaModelDefinitionId"
        placeholder="请选择子表"
        style="width: 100%"
        allowClear
        @change="subMetaModelDefinitionIdChange"
      >
        <a-select-option :value="seItem.currentDefinitionId" v-for="seItem in selectSheetList" :key="seItem.currentDefinitionId">{{
          seItem.metaModelName
        }}</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item label="关联主表字段:">
      <a-select
        v-model:value="formConfig.currentItem.formItemTable.subMetaModelLinkFieldId"
        placeholder="请选择关联主表字段"
        style="width: 100%"
        allowClear
      >
        <a-select-option :value="miaItem.fieldId" v-for="miaItem in mianFieldList" :key="miaItem.fieldId">{{
          miaItem.fieldCode
        }}</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item label="是否显示新增按钮:" class="form-row">
      <a-checkbox v-model:checked="formConfig.currentItem.formItemTable.showAddFlag" class="form-row-top"></a-checkbox>
    </a-form-item>
    <a-form-item label="是否显示删除:" class="form-row">
      <a-checkbox v-model:checked="formConfig.currentItem.formItemTable.showDeleteFlag" class="form-row-top"></a-checkbox>
    </a-form-item>
    <a-form-item label="是否显示序号:" class="form-row">
      <a-checkbox v-model:checked="formConfig.currentItem.formItemTable.showNumberFlag" class="form-row-top"></a-checkbox>
    </a-form-item>
    <a-form-item label="是否显示边框:" class="form-row">
      <a-checkbox v-model:checked="formConfig.currentItem.formItemTable.showBorderFlag" class="form-row-top"></a-checkbox>
    </a-form-item>
    <a-form-item label="默认行数:" class="form-row">
      <a-input-number v-model:value="formConfig.currentItem.formItemTable.defaultRowNumber" class="form-row-top" size="small" />
    </a-form-item>
  </div>
</template>

<script setup name="SelectTable">
import { inject, onMounted, ref } from 'vue';
import { ModelFieldApi } from '../../../../mid/app/sheet/api/ModelFieldApi';

const formConfig = inject('formConfig');

// 选择子表列表
const selectSheetList = inject('selectSheetList');

// 关联主表字段列表
const mianFieldList = ref([]);

onMounted(() => {
  let metaDefinitionId = formConfig.value.currentItem?.formItemTable?.subMetaModelDefinitionId;
  if (metaDefinitionId) {
    getMianFieldList(metaDefinitionId);
  }
});

const getMianFieldList = async metaDefinitionId => {
  mianFieldList.value = await ModelFieldApi.simpleGetFieldList({ metaDefinitionId: metaDefinitionId });
};

// 获取关联主表字段列表
const subMetaModelDefinitionIdChange = val => {
  formConfig.value.currentItem.formItemTable.subMetaModelLinkFieldId = null;
  if (val) {
    getMianFieldList(val);
  } else {
    mianFieldList.value = [];
  }
};
</script>

<style></style>
