<template>
  <el-card class="card">
    <div slot="header" class="card__header flex">
      <span class="card__header--span">字段列表</span>
      <div class="card__btngroup">
        <el-button
          @click="addAttrRows"
          :disabled="
            (formData.ents[entIndex] &&
              formData.ents[entIndex].isExternal != '1') ||
            (grandSonIndex != -1 &&
              formData.ents[entIndex].children &&
              formData.ents[entIndex].children[grandSonIndex] &&
              formData.ents[entIndex].children[grandSonIndex].isExternal != '1')
              ? false
              : true
          "
          type="primary"
        >
          添加字段
        </el-button>
        <!-- <el-button
          :disabled="isDisabled"
          icon="icon-application-delete"
          plain
          @click="handleBatchDelete"
        >
          删除
        </el-button> -->

        <el-button
          @click="reloadByEntId(formData.ents[entIndex])"
          v-if="
            formData && formData.ents &&
            formData.ents[entIndex] &&
            formData.ents[entIndex].id &&
            formData.ents[entIndex].isExternal == '1'
              ? true
              : false
          "
          plain
          style="margin-top: 9px"
        >
          <el-tooltip
            class="item"
            effect="dark"
            content="刷新字段后自动保存"
            placement="top"
          >
            <i class="icon-sync" style="margin-right: 8px" />
          </el-tooltip>
          刷新</el-button
        >
        <el-button
          @click="resetByEntId(formData.ents[entIndex])"
          v-if="
            formData && formData.ents &&
            formData.ents[entIndex] &&
            formData.ents[entIndex].id
          "
          plain
          style="margin-top: 9px"
        >
          <el-tooltip
            class="item"
            effect="dark"
            content="重置操作会覆盖原有的配置，该操作不可逆,需要保存才能生效"
            placement="top"
          >
            <i class="icon-reload" style="margin-right: 8px" />
          </el-tooltip>
          重置</el-button
        >
        <span style="margin-left:16px">按F2可快速添加字段</span>
      </div>
    </div>
    <div v-if="formData.ents && formData.ents.length != 0" class="card__body">
      <el-scrollbar class="scrollbar-fullheight">
        <el-table
          :data="attrData"
          ref="attrTableScrollbarHeight"
          data-vv-scope="attr"
          border
          class="card_body_table"
          @selection-change="handleSelectionChange"
        >
          <!-- <el-table-column
            align="center"
            type="selection"
            class-name="default-row"
          ></el-table-column> -->
          <el-table-column
            label="序号"
            type="index"
            align="center"
            width="50"
          ></el-table-column>
          <el-table-column label="注释" align="center" width="400">
            <template slot-scope="scope">
              <el-form-item class="table-item">
                <el-tooltip
                  class="item"
                  effect="dark"
                  :content="scope.row.comment"
                  placement="top-start"
                  :disabled="scope.row.comment ? false : true"
                >
                  <ht-input
                    v-model="scope.row.comment"
                    placeholder="请输入内容"
                    :id="scope.row.name + 'comment' + scope.$index"
                    @blur="entBlur(scope.$index)"
                    @input="
                      chineseFormat(
                        scope.row.name + 'attrName' + scope.$index,
                        attrData,
                        'name',
                        scope.$index,
                        scope.row.comment
                      )
                    "
                    clearable
                    :validate="{required: true}"
                    :maxlength="28"
                    show-word-limit
                  ></ht-input>
                </el-tooltip>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="名称" align="center" width="250">
            <template slot-scope="scope">
              <el-form-item class="table-item">
                <span
                  v-if="
                    (scope.row.id && formData.deployed) ||
                      scope.row.status == 'hide' ||
                      (openGrandSonAttr
                        ? grandSonIndex != -1 &&
                          formData.ents[entIndex].children[grandSonIndex]
                            .isExternal == '1'
                        : formData.ents[entIndex].isExternal == '1')
                  "
                  >{{ scope.row.name }}</span
                >
                <ht-input
                  v-else
                  :id="scope.row.name + 'attrName' + scope.$index"
                  v-model="scope.row.name"
                  @blur="entBlur(scope.$index)"
                  placeholder="请输入内容"
                  :maxlength="28"
                  :showWordLimit="true"
                  :validate="{
                    required: true,
                    regex: {
                      exp: '^[a-zA-Z][a-zA-Z0-9_]{0,28}$',
                      message:
                        '只能输入字母、数字、下划线，且以字母开头,长度不能超过28'
                    }
                  }"
                ></ht-input>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column
            prop="name"
            label="数据类型"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <el-form-item class="table-item">
                <span
                  v-if="
                    (scope.row.id && formData.deployed) ||
                      scope.row.status == 'hide' ||
                      (openGrandSonAttr
                        ? grandSonIndex != -1 &&
                          formData.ents[entIndex].children[grandSonIndex]
                            .isExternal == '1'
                        : formData.ents[entIndex].isExternal == '1')
                  "
                >
                  <span disabled v-if="scope.row.dataType == 'varchar'"
                    >字符串</span
                  >
                  <span
                    disabled
                    v-else-if="
                      scope.row.dataType == 'number' ||
                        scope.row.dataType == 'numeric' ||
                        scope.row.dataType == 'NUMERIC'
                    "
                    >数字</span
                  >
                  <span disabled v-else-if="scope.row.dataType == 'date'"
                    >日期</span
                  >
                  <span
                    disabled
                    v-else-if="
                      scope.row.dataType == 'text' ||
                        scope.row.dataType == 'clob'
                    "
                    >大文本</span
                  >
                  <span disabled v-else>其他类型</span>
                </span>
                <ht-select
                  v-else
                  class="m-r"
                  :options="dataType"
                  v-model="scope.row.dataType"
                  @change="defaultDataFormat(scope.row, scope.$index)"
                />
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column align="center" label="格式" width="280">
            <template slot-scope="scope">
              <!-- 日期 -->
              <template v-if="scope.row.dataType == 'date'">
                <div class="format-column">
                  <span
                    v-if="
                      scope.row.dataType != 'date' &&
                      scope.row.dataType != '日期'
                        ? false
                        : (scope.row.id && formData.deployed) ||
                          scope.row.status == 'hide' ||
                          (openGrandSonAttr
                            ? grandSonIndex != -1 &&
                              formData.ents[entIndex].children[grandSonIndex]
                                .isExternal == '1'
                            : formData.ents[entIndex].isExternal == '1')
                    "
                    >{{ scope.row.format }}</span
                  >
                  <ht-select
                    v-else-if="scope.row.dataType == 'date'"
                    v-model="scope.row.format"
                    :props="{key: 'key', value: 'value'}"
                    :options="dateFormat"
                  ></ht-select>
                </div>
              </template>

              <div class="format-column" v-else>
                <!-- 整数长度 -->
                <el-form-item
                  v-if="
                    scope.row.dataType != 'clob' && scope.row.dataType != 'text'
                  "
                  :label="scope.row.dataType == 'number' ? '整数:' : '长度:'"
                >
                  <div
                    class="format-column_content"
                    v-if="
                      (scope.row.id && formData.deployed) ||
                        scope.row.status == 'hide' ||
                        (openGrandSonAttr
                          ? grandSonIndex != -1 &&
                            formData.ents[entIndex].children[grandSonIndex]
                              .isExternal == '1'
                          : formData.ents[entIndex].isExternal == '1')
                    "
                  >
                    <span v-if="scope.row.dataType == 'number'">{{
                      scope.row.intLen
                    }}</span>
                    <span v-else>{{ scope.row.attrLength }}</span>
                    <i
                      v-if="!isExternal"
                      class="el-icon-edit"
                      @click="handleEditLen(scope.row)"
                    ></i>
                  </div>
                  <el-input
                    v-else-if="scope.row.dataType == 'varchar'"
                    :id="scope.row.name + 'attrLen' + scope.$index"
                    v-model="scope.row.attrLength"
                    style="width:220px"
                    @blur="entBlur(scope.$index)"
                  ></el-input>
                  <el-input-number
                    v-else-if="scope.row.dataType == 'number'"
                    :id="scope.row.name + 'attrLen' + scope.$index"
                    v-model="scope.row.attrLength"
                    controls-position="right"
                    @blur="entBlur(scope.$index)"
                    :max="15"
                  ></el-input-number>
                </el-form-item>
                <!-- 小数长度 -->
                <el-form-item
                  label="小数:"
                  v-if="scope.row.dataType == 'number'"
                >
                  <div
                    v-if="
                      scope.row.dataType != 'number' &&
                      scope.row.dataType != '数字'
                        ? false
                        : (scope.row.id && formData.deployed) ||
                          scope.row.status == 'hide' ||
                          (openGrandSonAttr
                            ? grandSonIndex != -1 &&
                              formData.ents[entIndex].children[grandSonIndex]
                                .isExternal == '1'
                            : formData.ents[entIndex].isExternal == '1')
                    "
                  >
                    <span>{{ scope.row.decimalLen }}</span>
                    <i
                      v-if="!isExternal"
                      class="el-icon-edit"
                      @click="handleEditDecimalLen(scope.row)"
                    ></i>
                  </div>

                  <el-input
                    v-else-if="scope.row.dataType == 'number'"
                    style="width:90px"
                    :id="scope.row.name + 'decima' + scope.$index"
                    v-model="scope.row.decimalLen"
                    @blur="entBlur(scope.$index)"
                  ></el-input>
                </el-form-item>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="必填" width="70" align="center">
            <template slot-scope="scope">
              <el-form-item class="table-item">
                <span
                  v-if="
                    (scope.row.id && formData.deployed) ||
                      scope.row.status == 'hide' ||
                      (openGrandSonAttr
                        ? grandSonIndex != -1 &&
                          formData.ents[entIndex].children[grandSonIndex]
                            .isExternal == '1'
                        : formData.ents[entIndex].isExternal == '1')
                  "
                >
                  <span v-if="scope.row.isRequired == 1">是</span>
                  <span v-else>否</span>
                </span>
                <el-switch
                  v-else
                  v-model="scope.row.isRequired"
                  inactive-value="0"
                  active-value="1"
                />
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="默认值" align="center">
            <template slot-scope="scope">
              <el-form-item class="table-item">
                <ht-input
                  v-if="
                    scope.row.dataType != 'clob' &&
                      scope.row.dataType != 'date' &&
                      scope.row.dataType != 'text'
                  "
                  v-model="scope.row.defaultValue"
                  placeholder="请输入内容"
                  :disabled="
                    (formData.ents[entIndex] &&
                      formData.ents[entIndex].isExternal != '1') ||
                    (grandSonIndex != -1 &&
                      formData.ents[entIndex].children &&
                      formData.ents[entIndex].children[grandSonIndex] &&
                      formData.ents[entIndex].children[grandSonIndex]
                        .isExternal != '1')
                      ? false
                      : true
                  "
                  :name="'defaultValue' + scope.$index"
                  :maxlength="attrMaxLength(scope.row)"
                  @blur="entBlur(scope.$index)"
                ></ht-input>
                <ht-date
                  v-else-if="scope.row.dataType == 'date'"
                  v-model="scope.row.defaultValue"
                  :format="scope.row.format"
                  :value-format="scope.row.format"
                  :disabled="
                    (formData.ents[entIndex] &&
                      formData.ents[entIndex].isExternal != '1') ||
                    (grandSonIndex != -1 &&
                      formData.ents[entIndex].children &&
                      formData.ents[entIndex].children[grandSonIndex] &&
                      formData.ents[entIndex].children[grandSonIndex]
                        .isExternal != '1')
                      ? false
                      : true
                  "
                  placeholder="请选择日期"
                ></ht-date>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="200">
            <template slot-scope="scope">
              <template v-if="scope.row.status == 'hide'">
                <el-button type="text" @click="recovery(scope.row)"
                  >恢复</el-button
                >
                <el-button
                  type="text"
                  @click="
                    handleCommand({
                      command: 'phyDelete',
                      row: scope.row,
                      index: scope.$index
                    })
                  "
                  >彻底删除</el-button
                >
              </template>
              <div
                v-else-if="
                  (formData.ents[entIndex].attributeList.length > 1 &&
                    scope.row.isExternal != '1') ||
                    (formData.ents[entIndex].children &&
                      attrTableData.length > 1)
                "
              >
                <el-button
                  type="text"
                  @click="
                    handleCommand({
                      command: 'del',
                      index: scope.$index,
                      row: scope.row
                    })
                  "
                  >删除</el-button
                >
                <el-button
                  type="text"
                  :disabled="scope.$index == 0 ? true : false"
                  @click="
                    handleCommand({
                      command: 'up',
                      row: scope.row,
                      index: scope.$index
                    })
                  "
                  >上升</el-button
                >
                <el-button
                  type="text"
                  :disabled="
                    scope.$index ==
                    (openGrandSonAttr
                      ? attrTableData.length - 1
                      : formData.ents[entIndex].attributeList.length - 1)
                      ? true
                      : false
                  "
                  @click="
                    handleCommand({
                      command: 'down',
                      row: scope.row,
                      index: scope.$index
                    })
                  "
                  >下降</el-button
                >
              </div>

              <el-button
                size="mini"
                class="el-icon-delete-solid"
                plain
                v-else
                disabled
              ></el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-scrollbar>
    </div>
    <el-empty
      v-else
      :image-size="380"
      :image="noDataImg"
      description="暂无字段，请在左侧添加实体~"
    >
    </el-empty>
  </el-card>
</template>

<script>
import form from '@/api/form.js'
import utils from '@/hotent-ui-util.js'

export default {
  name: 'BusinessObjAttr',
  props: [
    'openGrandSonAttr',
    'attrTableData',
    'formData',
    'entIndex',
    'grandSonIndex'
  ],
  watch: {
    openGrandSonAttr: function(v) {
      this.isOpenGrandSonAttr = v
    },
    attrTableData: function(v) {
      this.sonData = v
    },
    formData: function(v) {
      this.tableData = v
    },
    entIndex: function(v) {
      this.index = v
    },
    grandSonIndex: function(v) {
      this.sonIndex = v
    },
    selectedList(val) {
      this.isDisabled = val.length < 1 ? true : false
    }
  },
  data() {
    return {
      index: 0,
      sonIndex: 0,
      isOpenGrandSonAttr: false,
      hideAttr: [],
      sonData: [],
      tableData: [],
      dataType: [
        {key: 'varchar', value: '字符串'},
        {key: 'number', value: '数字'},
        {key: 'date', value: '日期'},
        {key: 'clob', value: '大文本'}
      ],
      dateFormat: [
        {key: 'yyyy-MM-dd HH:mm:ss', value: 'yyyy-MM-dd HH:mm:ss'},
        {key: 'yyyy-MM-dd', value: 'yyyy-MM-dd'}
      ],
      attrLenRecord: {},
      canModify: {},
      isDisabled: true,
      selectedList: [],
      selectedIds: '',
      noDataImg: require('@/assets/nodata_images/no-data.png'),
    }
  },
  computed: {
    attrData: function() {
      const data = this.openGrandSonAttr
        ? // eslint-disable-next-line vue/no-side-effects-in-computed-properties
          this.sonData
        : this.formData.ents[this.entIndex].attributeList
      this.handleModifyPermission(data)
      return data
    },
    // 是否外部表
    isExternal: function() {
      return (
        (this.formData.ents[this.entIndex] &&
          this.formData.ents[this.entIndex].isExternal == '1' &&
          this.grandSonIndex === -1) ||
        (this.grandSonIndex != -1 &&
          this.formData.ents &&
          this.formData.ents[this.entIndex] &&
          this.formData.ents[this.entIndex].children &&
          this.formData.ents[this.entIndex].children[this.grandSonIndex] &&
          this.formData.ents[this.entIndex].children[this.grandSonIndex]
            .isExternal == '1')
      )
    },
    attrMaxLength() {
      return function(row) {
        // 根据字段本身的长度返回默认值的最大长度
        let length = row.attrLength || 50
        if (row.dataType == 'number') {
          length =
            parseInt(row.attrLength || '0') + parseInt(row.decimalLen || '0')
        }
        return length
      }
    }
  },
  beforeDestroy() {
    //组件注销移除事件监听器，以防多次调用
    this.$root.$off('validateField')
  },
  methods: {
    //校验当前实体字段
    checkEntFunc(type) {
      let checkEntFuncData = {
        type: type,
        formData: [this.formData.ents[this.entIndex]]
      }
      this.$root.$emit('validateField', checkEntFuncData)
    },
    //表单数据加载
    getFormData() {
      const this_ = this
      if (this_.formData.id) {
        form.getEntData(this_.formData.id, resp => {
          resp.data.ents.forEach((entData, index) => {
            if (entData.isExternal == '1' && index == 0) {
              entData.show = '主实体-外'
            } else if (entData.isExternal == '1') {
              entData.show = '子实体-外'
            }
            if (index === 0) {
              entData.isCheck = true
            }
            if (entData.children) {
              entData.children.forEach(v => {
                if (v.isExternal == '1') {
                  v.show = '孙实体-外'
                }
              })
            }
            for (let q = 0; q < entData.attributeList.length; q++) {
              if (entData.attributeList[q]) {
                if (entData.attributeList[q].isRequired == 0) {
                  entData.attributeList[q].isRequired = '0'
                } else {
                  entData.attributeList[q].isRequired = '1'
                }
              }
              for (let i = 0; i < entData.attributeList.length - 1 - q; i++) {
                if (
                  entData.attributeList[i].index >
                  entData.attributeList[i + 1].index
                ) {
                  let temp = entData.attributeList[i]
                  entData.attributeList[i] = entData.attributeList[i + 1]
                  entData.attributeList[i + 1] = temp
                }
              }
            }
          })
          resp.data.ents.forEach(data => {
            data.isCheck = false
          })
          //获取选中实体
          resp.data.ents[this_.entIndex].isCheck = true
          this_.$emit('update:formData', resp.data)
        })
      }
    },
    //刷新元数据
    reloadByEntId(ent) {
      let id = ent.id
      if (this.openGrandSonAttr && ent.children && ent.children.length > 0) {
        id = ent.children[this.grandSonIndex].id
      }
      let _this = this
      form.reloadByEntId(id, _this.formData).then(resp => {
        if (resp.state) {
          _this.$message({
            message: '刷新成功,若字段有变化请重新拖拽字段设计表单',
            type: 'success'
          })
          resp.value.ents.forEach((entData, index) => {
            if (entData.isExternal == '1' && index == 0) {
              entData.show = '主实体-外'
            } else if (entData.isExternal == '1') {
              entData.show = '子实体-外'
            }
            if (index === 0) {
              entData.isCheck = true
            }
            if (entData.children) {
              entData.children.forEach(v => {
                if (v.isExternal == '1') {
                  v.show = '孙实体-外'
                }
              })
            }
            for (let q = 0; q < entData.attributeList.length; q++) {
              if (entData.attributeList[q]) {
                if (entData.attributeList[q].isRequired == 0) {
                  entData.attributeList[q].isRequired = '0'
                } else {
                  entData.attributeList[q].isRequired = '1'
                }
              }
              for (let i = 0; i < entData.attributeList.length - 1 - q; i++) {
                if (
                  entData.attributeList[i].index >
                  entData.attributeList[i + 1].index
                ) {
                  let temp = entData.attributeList[i]
                  entData.attributeList[i] = entData.attributeList[i + 1]
                  entData.attributeList[i + 1] = temp
                }
              }
            }
          })
          resp.value.ents.forEach(data => {
            data.isCheck = false
          })
          //获取选中实体
          resp.value.ents[_this.entIndex].isCheck = true
          _this.$emit('update:formData', resp.value)
        } else {
          this.$message({message: resp.message, type: 'error'})
        }
      })
    },
    //重置元数据
    resetByEntId(ent) {
      let id = ent.id
      if (this.openGrandSonAttr && ent.children && ent.children.length > 0) {
        id = ent.children[this.grandSonIndex].id
      }
      this.$confirm(
        '重置操作会覆盖原有的配置，该操作不可逆, 是否继续?',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      )
        .then(() => {
          let _this = this
          form.resetByEntId(id, _this.formData).then(resp => {
            if (resp.state) {
              _this.$message({
                message: '重置成功,需保存后生效',
                type: 'success'
              })
              resp.value.ents.forEach((entData, index) => {
                if (entData.isExternal == '1' && index == 0) {
                  entData.show = '主实体-外'
                } else if (entData.isExternal == '1') {
                  entData.show = '子实体-外'
                }
                if (index === 0) {
                  entData.isCheck = true
                }
                if (entData.children) {
                  entData.children.forEach(v => {
                    if (v.isExternal == '1') {
                      v.show = '孙实体-外'
                    }
                  })
                }
                for (let q = 0; q < entData.attributeList.length; q++) {
                  if (entData.attributeList[q]) {
                    if (entData.attributeList[q].isRequired == 0) {
                      entData.attributeList[q].isRequired = '0'
                    } else {
                      entData.attributeList[q].isRequired = '1'
                    }
                  }
                  for (
                    let i = 0;
                    i < entData.attributeList.length - 1 - q;
                    i++
                  ) {
                    if (
                      entData.attributeList[i].index >
                      entData.attributeList[i + 1].index
                    ) {
                      let temp = entData.attributeList[i]
                      entData.attributeList[i] = entData.attributeList[i + 1]
                      entData.attributeList[i + 1] = temp
                    }
                  }
                }
              })
              resp.value.ents.forEach(data => {
                data.isCheck = false
              })
              const resultData = _.cloneDeep(resp.value)
              if(this.openGrandSonAttr && ent.children && ent.children.length > 0){
                 this.sonData = resultData.ents[this.entIndex].children[this.grandSonIndex].attributeList.filter(item=>!item.isNew
)
              }
              //获取选中实体
              resp.value.ents[_this.entIndex].isCheck = true
              _this.$emit('update:formData', resp.value)
            }
          })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消该操作'
          })
        })
    },
    entBlur(index) {
      this.$emit('entBlur', index)
      this.checkEntFunc(true)
    },
    chineseFormat(id, list, param, index, v) {
      this.$emit('chineseFormat', id, list, param, index, v)
    },
    //新增字段
    addAttrRows() {
      let row = {
        comment: '',
        name: '',
        isRequired: '0',
        dataType: 'varchar',
        format: '',
        intLen: '',
        attrLength: 200,
        decimalLen: 0,
        isNew: true,
        defaultValue: '',
        desc: '',
        index: this.openGrandSonAttr
          ? this.sonData.length + 1
          : this.formData.ents[this.entIndex].attributeList.length + 1
      }
      if (this.openGrandSonAttr) {
        this.sonData.push(row)
      } else {
        this.formData.ents[this.entIndex].attributeList.push(row)
      }
    },
    //数据类型切换设置默认值
    defaultDataFormat(row, index) {
      // 切换属性类型时，清空默认值
      this.$set(row, 'defaultValue', null)
      let selectAttr = this.formData.ents[this.entIndex].attributeList
      if (this.openGrandSonAttr) {
        selectAttr = this.sonData
      }
      selectAttr[index].attrLength = 0
      selectAttr[index].decimalLen = 0
      selectAttr[index].format = ''
      if (row.dataType == 'date') {
        selectAttr[index].format = 'yyyy-MM-dd HH:mm:ss'
      } else if (row.dataType == 'varchar') {
        selectAttr[index].attrLength = 200
      } else if (row.dataType == 'number') {
        selectAttr[index].attrLength = 10
        selectAttr[index].decimalLen = 2
        selectAttr[index].defaultValue = '0'
      }
    },
    handleCommand(param) {
      switch (param.command) {
        case 'del':
          this.deleteAttrRows(param.row, param.index)
          break
        case 'up':
          this.attrUp(param.row, param.index)
          break
        case 'down':
          this.attrDown(param.row, param.index)
          break
        case 'phyDelete':
          this.phyDelete(param.row, param.index)
          break
        default:
          break
      }
    },

    // 删除字段 伪删除 设置字段 status 值 hide
    isDel(row, index) {
      let count = 0
      this.formData.ents[this.entIndex].attributeList.forEach(item => {
        if (item.status === 'hide') {
          count++
        }
      })
      if (count >= this.formData.ents[this.entIndex].attributeList.length - 1) {
        this.$message({message: '最后一个字段不能删除！', type: 'warning'})
        return
      }
      if (!this.formData.deployed) {
        form
          .deleteAttr(row.id)
          .then(resp => {
            if (resp.data.state) {
              this.$message({message: resp.data.message, type: 'success'})
            } else {
              this.$message({message: resp.data.message, type: 'error'})
              return
            }
          })
          .then(() => {
            this.formData.ents[this.entIndex].attributeList.splice(index, 1)
            this.formData.ents[this.entIndex].attributeList.forEach(
              (item, attrIndex) => {
                if (attrIndex == index) {
                  item.index = item.index - 1
                  ++index
                }
              }
            )
            form.saveEntData(this.formData).then(resp => {
              if (resp.data.state) {
                this.formData.rev++
              }
            })
          })
      } else {
        form.removeAttr([row], this.formData.alias).then(resp => {
          if (resp.data.state) {
            this.$message({
              message: resp.data.message + '，建模数据已更新！',
              type: 'success'
            })
            this.$set(
              row,
              'status',
              row.status === 'show' || !row.status ? 'hide' : 'show'
            )
            // this.$emit('getFormData')
          } else {
            this.$message({message: resp.data.message, type: 'error'})
            return
          }
        })
      }
    },
    //删除字段
    deleteAttrRows(row, index) {
      if (!this.openGrandSonAttr) {
        if (row.id == undefined) {
          this.formData.ents[this.entIndex].attributeList.splice(index, 1)
          this.formData.ents[this.entIndex].attributeList.forEach(
            (item, attrIndex) => {
              if (attrIndex == index) {
                item.index = item.index - 1
                ++index
              }
            }
          )
          return
        }
        this.isDel(row, index)
      } else {
        if (!row.id) {
          this.attrTableData.splice(index, 1)
          this.attrTableData.forEach((item, i) => {
            if (i == index) {
              item.index = item.index - 1
              ++index
            }
          })
          return
        }
        this.isDel(row, index)
      }
    },
    attrUp(row, index) {
      if (!this.openGrandSonAttr) {
        this.formData.ents[this.entIndex].attributeList[index].index =
          this.formData.ents[this.entIndex].attributeList[index].index - 1
        this.formData.ents[this.entIndex].attributeList[index - 1].index =
          this.formData.ents[this.entIndex].attributeList[index - 1].index + 1
        this.formData.ents[this.entIndex].attributeList = utils.arrayMove(
          this.formData.ents[this.entIndex].attributeList,
          row,
          'up'
        )
      } else {
        this.sonData[index].index = this.sonData[index].index - 1
        this.sonData[index - 1].index = this.sonData[index - 1].index + 1
        this.sonData = utils.arrayMove(this.sonData, row, 'up')
      }
    },
    attrDown(row, index) {
      if (!this.openGrandSonAttr) {
        this.formData.ents[this.entIndex].attributeList[index].index =
          this.formData.ents[this.entIndex].attributeList[index].index + 1
        this.formData.ents[this.entIndex].attributeList[index + 1].index =
          this.formData.ents[this.entIndex].attributeList[index + 1].index - 1
        this.formData.ents[this.entIndex].attributeList = utils.arrayMove(
          this.formData.ents[this.entIndex].attributeList,
          row,
          'down'
        )
      } else {
        this.sonData[index].index = this.sonData[index].index + 1
        this.sonData[index + 1].index = this.sonData[index + 1].index - 1
        this.sonData = utils.arrayMove(this.sonData, row, 'down')
      }
    },
    recovery(row) {
      form.recovery(row, this.formData.alias).then(resp => {
        if (resp.data.state) {
          this.$message({
            message: resp.data.message + '，建模数据已更新',
            type: 'success'
          })
          this.$set(row, 'status', row.status === 'hide' ? 'show' : 'hide')
          this.$emit('getFormData')
        }
      })
    },
    refreshAttr(cb) {
      let param = {
        dsalias: this.formData.ents[this.entIndex].dsName,
        isTable: '1',
        objName: this.formData.ents[this.entIndex].tableName
      }
      if (this.openGrandSonAttr) {
        param.objName = this.formData.ents[this.entIndex].children[
          this.grandSonIndex
        ].tableName
        param.dsalias = this.formData.ents[this.entIndex].children[
          this.grandSonIndex
        ].dsName
      }
      form
        .getHideAttr(param.objName)
        .then(resp => {
          if (resp) {
            this.hideAttr = resp
          }
        })
        .then(() => {
          form
            .getTableList(param)
            .then(resp => {
              this.isExit = false
              this.refreshData = resp
            })
            .then(() => {
              for (let i = 0; i < this.refreshData.data.length; i++) {
                if (this.refreshData.data[i].name == param.objName) {
                  // 删除主键和外键
                  this.$http
                    .get(
                      '${form}/bo/def/v1/reloadByEntId?entId=' +
                        this.formData.ents[this.entIndex].id
                    )
                    .then(resp => {
                      let json = JSON.parse(
                        JSON.stringify(resp.data.table.columnList)
                          .replace(/charLen/g, 'attrLength')
                          .replace(/fieldName/g, 'name')
                          .replace(/columnType/g, 'dataType')
                          .replace(/fdataType/g, 'fcolumnType')
                      )
                      let _this = this
                      let data = {}
                      if (this.hideAttr.length > 0) {
                        let attr = ''
                        this.hideAttr.forEach(v => {
                          attr += v.fieldName + ','
                        })
                        json = json.filter(value => {
                          return !attr.includes(value.fieldName)
                        })
                      }
                      if (this.openGrandSonAttr) {
                        this.formData.ents[this.entIndex].children[
                          this.grandSonIndex
                        ].attributeList = json
                        data = this.formData.ents[this.entIndex].children[
                          this.grandSonIndex
                        ]
                      } else {
                        this.formData.ents[this.entIndex].attributeList = json
                        data = this.formData.ents[this.entIndex]
                      }
                      data.attributeList = data.attributeList.filter(item => {
                        let val = item.name.toUpperCase()
                        return (
                          !item.isPk &&
                          val != 'F_FORM_DATA_REV_' &&
                          (!_this.formData.ents.fk ||
                            val != _this.formData.ents.fk.toUpperCase())
                        )
                      })
                      data.attributeList.forEach((item, index) => {
                        item.index = index + 1
                        if (item.attrLength == 0 && item.intLen != 0) {
                          item.attrLength = item.intLen
                        }
                      })
                      this.$message({message: '刷新成功', type: 'success'})
                      this.isExit = true
                    })
                  break
                }
              }
              setTimeout(() => {
                if (!this.isExit) {
                  if (this.openGrandSonAttr) {
                    this.formData.ents[this.entIndex].children[
                      this.grandSonIndex
                    ].attributeList = []
                    this.getGrandSonEntsByIndex(
                      this.grandSonIndex,
                      this.entIndex
                    )
                  } else {
                    if (this.entIndex == 0) {
                      form.removeBusinessObj(this.formData.id).then(() => {
                        this.handleDialogClose()
                      })
                    } else {
                      this.formData.ents[this.entIndex].attributeList = []
                      this.$emit('getEntsByIndex', this.entIndex)
                    }
                  }
                }
              }, 500)
              this.isExit = false
            })
        })
    },
    handleEditLen(row) {
      let len
      if (this.attrLenRecord.hasOwnProperty(row.id)) {
        len = this.attrLenRecord[row.id]
      } else {
        len = row.attrLength
        this.attrLenRecord[row.id] = len
      }
      let this_ = this
      this.$prompt('请输入新的长度', '长度编辑', {
        closeOnClickModal:false,
        inputValidator: val => {
          if (isNaN(val)) {
            return '请输入数字'
          }
          if (Number(val) < len) {
            return `新长度不能小于${len}`
          }
          if (row.columnType === 'varchar' && Number(val) > 21500) {
            return '新长度不能大于21500'
          }
          if (row.columnType === 'number' && Number(val) > 15) {
            return '整数长度不能大于15'
          }
        },
        inputValue: row.attrLength
      }).then(param => {
        if (param && param.action === 'confirm') {
          let val = Number(param.value)
          if (val >= len) {
            this_.$set(row, 'intLen', val)
            this_.$set(row, 'charLen', val)
            this_.$set(row, 'attrLength', val)
          }
        }
      })
    },
    handleEditDecimalLen(row) {
      let len
      let key = 'Decimal' + row.id
      if (this.attrLenRecord.hasOwnProperty(key)) {
        len = this.attrLenRecord[key]
      } else {
        len = row.decimalLen
        this.attrLenRecord[key] = len
      }
      let this_ = this
      this.$prompt('请输入新的精度', '精度编辑', {
        inputValidator: val => {
          if (isNaN(val)) {
            return '请输入数字'
          }
          if (Number(val) < len) {
            return `新精度不能小于${len}`
          }
        },
        inputValue: row.decimalLen
      }).then(param => {
        if (param && param.action === 'confirm') {
          this_.$set(row, 'decimalLen', Number(param.value))
        }
      })
    },
    handleModifyPermission(rows) {
      // rows.forEach(item => {
      //   this.canModify[item.id] = true;
      // })
      rows.forEach((item, index) => {
        this.canModify[item.id] = true
        if (item.name === 'TENANT_ID_') {
          rows.splice(index, 1)
        }
      })

      // return rows.filter(item=>{
      //   if (item.name!='TENANT_ID_'){
      //     this.canModify[item.id] = true
      //     return item
      //   }
      // })
    },
    phyDelete(row, index) {
      if (this.formData.boEnt.isExternal == '1') {
        this.$message.error(
          '外部表不支持该操作，请使用管理工具在该数据源上操作，完成后刷新字段'
        )
        return
      }
      this.$confirm(
        '此操作将会把改列从数据库中删除，请确保该列上无数据(如果有不为null的数据，将无法删除)',
        '警告',
        {
          type: 'warning'
        }
      )
        .then(() => {
          form.phyDeleteAttrById(row.id, this.formData.alias).then(resp => {
            if (resp.data && resp.data.state) {
              this.attrData.splice(index, 1)
              this.$message.success(resp.data.message)
            }
          })
        })
        .catch(() => {})
    },
    handleSelectionChange(selection) {
      this.selectedList = selection
    }
    // handleBatchDelete() {
    //   console.log('批量删除', this.selectedList)
    //   console.log(this.openGrandSonAttr)
    //   if (!this.openGrandSonAttr) {
    //     this.selectedList.forEach(item => {
    //       console.log(item)
    //     })
    //     // if (row.id == undefined) {
    //     //   this.formData.ents[this.entIndex].attributeList.splice(index, 1)
    //     //   this.formData.ents[this.entIndex].attributeList.forEach(
    //     //     (item, attrIndex) => {
    //     //       if (attrIndex == index) {
    //     //         item.index = item.index - 1
    //     //         ++index
    //     //       }
    //     //     }
    //     //   )
    //     //   return
    //     // }
    //     // this.isDel(row, index)
    //   } else {
    //     // if (!row.id) {
    //     //   this.attrTableData.splice(index, 1)
    //     //   this.attrTableData.forEach((item, i) => {
    //     //     if (i == index) {
    //     //       item.index = item.index - 1
    //     //       ++index
    //     //     }
    //     //   })
    //     //   return
    //     // }
    //     // this.isDel(row, index)
    //   }
    // }
  },
  mounted() {
    let _this = this
    document.onkeydown = function() {
      if (_this.formData.ents && _this.formData.ents.length > 0) {
        let key = window.event.keyCode
        if (
          key === 113 &&
          _this.formData.ents[_this.entIndex].isExternal != '1'
        ) {
          //== 83 && event.ctrlKey
          _this.addAttrRows()
          setTimeout(function() {
            _this.$refs.attrTableScrollbarHeight.bodyWrapper.scrollTop =
              _this.$refs.attrTableScrollbarHeight.bodyWrapper.scrollHeight
          }, 500)
        }
      }
    }
  }
}
</script>

<style lang="scss" scoped>
@import '@/assets/css/element-variables.scss';

.card {
  color: $--color-text-primary;
  height: calc(100% - 10px);
  .card__header--span {
    font-weight: 700;
  }
  .card__btngroup {
    margin-left: 20px;
  }
  /deep/ .el-card__body {
    height: calc(100% - 100px);
  }
  .card__body {
    height: 100%;
  }
  .scrollbar-fullheight {
    height: 100%;
  }
}

/deep/ .card_body_table {
  .inputs {
    width: 100%;
    .el-date-editor.el-input,
    .el-date-editor.el-input__inner {
      width: 100%;
    }
  }
  &.el-table th {
    background: #f5f7fa;
    padding: 16px 0;
  }
  &.el-table--small td {
    padding: 20px 5px;
  }
  .el-form-item {
    margin-bottom: 0;
  }
  .format-column {
    display: flex;

    .el-form-item__content {
      display: flex;
    }
    .format-column_content {
      text-align: left;
    }
    .el-icon-edit {
      cursor: pointer;
      color: #409eff;
      font-size: 16px;
      margin-left: 5px;
    }
    .el-form-item:first-child {
      margin-right: 20px;
    }
  }
}
</style>
