<template>
  <div>
    <sd-data-table-ex
      ref="dataTable"
      form-id="iamTreeListConfig"
      page-id="core/treelistconfig/iamTreeListConfig"
      :columns="columns"
      :actions="actions"
      show-selection
      :search-fields="['treeTableId', 'listTableId']"
    >
      <template v-slot:form="{ model }">
        <div><h3>tree信息</h3><hr /></div>
        <!-- 数据库表名 -->
        <sd-form-item name="treeTableId">
          <sd-select
            v-model="model.treeTableId"
            :options="treeTableOptions"
            @change="setTreeField"
          />
        </sd-form-item>
        <!-- id列名 -->
        <sd-form-item name="treeIdColumnId">
          <sd-select
            v-model="model.treeIdColumnId"
            :options="treeIdColumnOptions"
            @focus="initTreeField"
          />
        </sd-form-item>
        <!-- 名称列名 -->
        <sd-form-item name="treeNameColumnId">
          <sd-select
            v-model="model.treeNameColumnId"
            :options="treeNameColumnOptions"
            @focus="initTreeField"
          />
        </sd-form-item>
        <!-- 父id列名 -->
        <sd-form-item name="treeParentColumnId">
          <sd-select
            v-model="model.treeParentColumnId"
            :options="treeParentColumnOptions"
            @focus="initTreeField"
          />
        </sd-form-item>
        <!-- 排序列名 -->
        <sd-form-item name="treeOrderColumnId">
          <sd-select
            v-model="model.treeOrderColumnId"
            :options="treeOrderColumnOptions"
            @focus="initTreeField"
          />
        </sd-form-item>
        <!-- 其他列名 -->
        <sd-form-item name="treeOtherColumnId">
          <sd-select
            v-model="model.treeOtherColumnId"
            :options="treeOtherColumnOptions"
            mode="multiple"
          />
        </sd-form-item>
        <!-- 服务名称 -->
        <sd-form-item name="treeServiceName" />
        <!-- 更新父id方法名称 -->
        <sd-form-item name="treeUpdParentMethodName" />
        <!-- 更新排序号方法名称 -->
        <sd-form-item name="treeUpdOrderMethodName" />
        <div><h3>list信息</h3><hr /></div>
        <!-- 数据库表名 -->
        <sd-form-item name="listTableId">
          <sd-select
            v-model="model.listTableId"
            :options="listTableOptions"
            @change="setListField"
          />
        </sd-form-item>
        <!-- 显示列名 -->
        <sd-form-item name="listShowColumnId">
          <sd-select
            v-model="model.listShowColumnId"
            :options="listShowColumnOptions"
            mode="multiple"
            @focus="initListField"
          />
        </sd-form-item>
        <!-- 查询列名 -->
        <sd-form-item name="listQueryColumnId">
          <sd-select
            v-model="model.listQueryColumnId"
            :options="listQueryColumnOptions"
            mode="multiple"
            @focus="initListField"
          />
        </sd-form-item>
        <!-- 父id列名 -->
        <sd-form-item name="listParentColumnId">
          <sd-select
            v-model="model.listParentColumnId"
            :options="listParentColumnOptions"
            @focus="initListField"
          />
        </sd-form-item>
        <!-- 服务名称 -->
        <!--<sd-form-item name="listServiceName" />-->
        <!-- 增加或更新方法名称 -->
        <!--<sd-form-item name="listCreateorupdateMethodName" />-->
        <!-- 查询方法名称 -->
        <!--<sd-form-item name="listQueryMethodName" />-->
        <!-- 删除方法名称 -->
        <!--<sd-form-item name="listDelMethodName" />-->
        <!-- 扩展文本字段
      <sd-form-item name="reservestring1" />

      <sd-form-item name="reservestring2" />

      <sd-form-item name="reservestring3" />

      <sd-form-item name="reservestring4" />

      <sd-form-item name="reservestring5" />
       -->
        <!-- 扩展数字字段
      <sd-form-item name="reservelong1" />

      <sd-form-item name="reservelong2" />

      <sd-form-item name="reservelong3" />

      <sd-form-item name="reservelong4" />

      <sd-form-item name="reservelong5" />
       -->
      </template>
      <span slot="AppointmentTime" slot-scope="appointmentTime">
        {{ appointmentTime | sdDateFormat('YYYY-MM-DD HH:mm') }}
      </span>
    </sd-data-table-ex>
  </div>
</template>

<script>
import TableActionTypes from '@/common/services/table-action-types'
import TreeconfigService from '../treeconfig/treeconfig-service'
import components from './_import-components/iam-audit-treelistconfig-import'

export default {
  name: 'IamAuditTreelistconfig',
  metaInfo: {
    title: 'treelist组件配置',
  },
  components,
  data() {
    return {
      columns: [
        {
          title: '序号',
          customRender: (text, record, index) => `${index + 1}`,
          width: '80px',
        },
        {
          title: 'ID',
          dataIndex: 'id',
        },
        {
          title: 'tree数据库表名',
          dataIndex: 'treeTableId',
          sdClickable: true,
          customRender: (text, record, index) => {
            var arr = JSON.parse(text)
            return arr[0].name
          },
        },
        {
          title: 'list数据库表名',
          dataIndex: 'listTableId',
          sdClickable: true,
          customRender: (text, record, index) => {
            var arr = JSON.parse(text)
            return arr[0].name
          },
        },
      ],
      actions: [
        {
          label: '新建',
          id: 'new',
          type: TableActionTypes.oa.create, // 新建按钮，不需要回调，自动处理
        },
        {
          label: '删除',
          id: 'delete',
          type: TableActionTypes.oa.delete, // 删除按钮，不需要回调，会自动处理
        },
      ],
      treeTableOptions: [],
      treeIdColumnOptions: [],
      treeNameColumnOptions: [],
      treeParentColumnOptions: [],
      treeOrderColumnOptions: [],
      treeOtherColumnOptions: [],
      listTableOptions: [],
      listShowColumnOptions: [],
      listQueryColumnOptions: [],
      listParentColumnOptions: [],
    }
  },
  created() {
    TreeconfigService.findIamEntity().then((res) => {
      if (res.data) {
        this.treeTableOptions = res.data
        this.listTableOptions = res.data
      }
    })
  },
  methods: {
    setTreeField(item) {
      if (item.length > 0) {
        var entityName = item[0].id
        TreeconfigService.findIamEntityAttr(entityName).then((res) => {
          if (res.data) {
            this.treeIdColumnOptions = res.data
            this.treeNameColumnOptions = res.data
            this.treeParentColumnOptions = res.data
            this.treeOrderColumnOptions = res.data
            this.treeOtherColumnOptions = res.data
          }
        })
      }
    },
    setListField(item) {
      if (item.length > 0) {
        var entityName = item[0].id
        TreeconfigService.findIamEntityAttr(entityName).then((res) => {
          if (res.data) {
            this.listShowColumnOptions = res.data
            this.listQueryColumnOptions = res.data
            this.listParentColumnOptions = res.data
          }
        })
      }
    },
    initTreeField(item) {
      var obj = this.$refs.dataTable.getDetailModal().getFieldValue('treeTableId')
      if (obj !== undefined) {
        if (this.treeIdColumnOptions.length === 0) {
          this.setTreeField(obj)
        }
      }
    },
    initListField(item) {
      var obj = this.$refs.dataTable.getDetailModal().getFieldValue('listTableId')
      if (obj !== undefined) {
        if (this.listShowColumnOptions.length === 0) {
          this.setListField(obj)
        }
      }
    },
  },
}
</script>

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