tnc-fe/src/views/codegen/form/tables/IndexTable.vue

<template>
  <j-editable-table
    ref="editableTable"
    :loading="loading"
    :columns="columns"
    :dataSource="dataSource"
    :rowNumber="true"
    :rowSelection="true"
    :actionButton="actionButton"
    :maxHeight="300"
  />
</template>

<script>

import { FormTypes } from '@/utils/JEditableTableUtil'

export default {
  name: 'IndexTable',
  components: {},
  props: {
    actionButton: {
      type: Boolean,
      default: true,
      required: false
    }
  },
  data: function () {
    return {
      loading: false,
      dataSource: [],
      columns: [{
        title: "索引名称",
        key: "indexName",
        width: "330px",
        type: FormTypes.input,
        defaultValue: "",
        placeholder: "请输入${title}",
        validateRules: [
          {
            required: true,
            message: "${title}不能为空"
          }
        ]
      }, {
        title: "索引栏位",
        key: "indexField",
        width: "330px",
        type: FormTypes.list_multi,
        options: [],
        defaultValue: "",
        placeholder: "请选择${title}",
        validateRules: [
          {
            required: true,
            message: "请选择${title}"
          }
        ],
        props: {
          notFoundContent: "没有什么好选择的"
        }
      }, {
        title: "索引类型",
        key: "indexType",
        width: "330px",
        type: FormTypes.select,
        options: [
          {
            title: "normal",
            value: "normal"
          },
          {
            title: "unique",
            value: "unique"
          }
        ],
        defaultValue: "normal",
        placeholder: "请选择${title}",
        validateRules: [
          {
            required: true,
            message: "请选择${title}"
          }
        ]
      }]
    }
  },
  methods: {
    syncTable(target) {
      target.$refs.editableTable.getValuesPromise(false)
        .then(values => {
          let arr = [];
          values.forEach(((item) => {
            if (item.dbFieldName) {
              arr.push({title: item.dbFieldName, value: item.dbFieldName})
            }
          }))
          this.columns[1].options = arr
        });
    }
  }
}
</script>

<style scoped>

</style>