<template>
  <!-- 操作栏 -->
  <component
    :is="comTable.tableColumnName"
    prop="menu"
    key="menu"
    :fixed="vaildData(comTable.tableOption.menuFixed, config.menuFixed)"
    v-if="vaildData(comTable.tableOption.menu, config.menu)"
    :label="comTable.tableOption.menuTitle || '操作'"
    :align="comTable.tableOption.menuAlign || config.menuAlign"
    :header-align="comTable.tableOption.menuHeaderAlign || config.menuHeaderAlign"
    :width="comTable.tableOption.menuWidth || config.menuWidth"
  >
    <template slot="header">
      <span>{{ comTable.tableOption.menuTitle || '操作' }}</span>
    </template>
    <template slot-scope="{ row, column: tableColumn, $index }">
      <div>
        <template>
          <el-button
            :type="`text`"
            :icon="`el-icon-edit`"
            :size="comTable.isMediumSize"
            :disabled="comTable.btnDisabled"
            @click.stop="comTable.rowEdit(row, $index)"
            v-if="vaildData(comTable.tableOption.editBtn, config.editBtn)"
          >
            {{ '编 辑' }}
          </el-button>
          <el-button
            :type="`text`"
            :icon="`el-icon-delete`"
            :size="comTable.isMediumSize"
            :disabled="comTable.btnDisabled"
            @click.stop="comTable.rowDel(row, $index)"
            v-if="vaildData(comTable.tableOption.delBtn, config.delBtn)"
          >
            {{ '删 除' }}
          </el-button>
        </template>
        <slot
          name="menu"
          :row="row"
          :column="tableColumn"
          :type="`text`"
          :disabled="comTable.btnDisabled"
          :size="comTable.isMediumSize"
          :index="$index"
        ></slot>
      </div>
    </template>
  </component>
</template>

<script>
import config from './config.js';
import base from '../../utils/base.js';

export default {
  name: 'comTable',
  mixins: [base()],
  components: {},
  data() {
    return {
      config: config,
    };
  },
  inject: ['comTable'],
  mounted: function () {},
};
</script>
