<template>
  <a-dropdown :trigger="['click']" class="app-export-excel" overlayClassName="app-export-excel__dropdown">
    <template #overlay>
      <a-menu>
        <a-menu-item key="1" @click="exportExcel('maxRowCount', $event)">最大{{ item.caption }}1000行</a-menu-item>
        <a-menu-item key="2" @click="exportExcel('activatedPage', $event)">{{ item.caption }}当前页</a-menu-item>
        <a-menu-item key="3">
          <span>
            <a-input-number v-model:value="startPage" @change="onChange('start')" :min="1" @click.stop :controls="false" />
            ~
            <a-input-number v-model:value="endPage" @change="onChange('end')" @click.stop :min="2" :controls="false" />
            <a-button type="text" @click="exportExcel('custom', $event)">GO</a-button>
          </span>
        </a-menu-item>
      </a-menu>
    </template>
    <a-button>
      <i v-if="item.iconClass" :class="item.iconClass"></i>
      <img v-if="item.imgPath" :src="item.imgPath" alt="" />
      {{ item.caption }}
      <DownOutlined />
    </a-button>
  </a-dropdown>
</template>
<script  setup lang='ts'>
import { deepCopy, IParam } from '@core';
import { DownOutlined } from '@ant-design/icons-vue';
// 接口声明
interface exportExcelProps {
  item: any;
}
interface exportExcelEmit {
  (name: 'exportExcel', value: IParam): void;
}

const emit = defineEmits<exportExcelEmit>();
const props = withDefaults(defineProps<exportExcelProps>(), {});

// 初始化选择值
const startPage = ref(1);
const endPage = ref(2);

/**
 * 导出数据
 *
 * @param {*} $event
 * @param {string} type
 * @returns {void}
 * @memberof AppExportExcel
 */
const exportExcel = (type: string, $event: MouseEvent): void => {
  const exportParams: any = { type: type };
  if (Object.is(type, 'maxRowCount')) {
    Object.assign(exportParams, { maxRowCount: 1000 });
  } else if (Object.is(type, 'activatedPage')) {
  } else if (Object.is(type, 'custom')) {
    Object.assign(exportParams, { startPage: startPage.value, endPage: endPage.value });
  }
  emit('exportExcel', Object.assign(deepCopy(props.item), { event: { exportParams: exportParams, event: $event } }));
};

/** 
 * 计算自定义导出页数逻辑
 * 
 * @memberof AppExportExcel
 */
const onChange = (type: string) => {
  if (type === 'start') {
    if (startPage.value >= endPage.value) {
      startPage.value = endPage.value - 1;
    }
  }
  if (type === 'end') {
    if (endPage.value >= startPage.value) {
      endPage.value = startPage.value + 1;
    }
  }
}
</script>

<style lang="scss">
.app-export-excel {
  font-size: var(--app-font-size-md);
  padding: 4px 12px;
  i {
    padding-right: 6px;
  }
  .anticon.anticon-down {
    margin-left: 6px;
  }
}
.app-export-excel__dropdown {
  .ant-input-number {
    width: 50px;
  }
}
</style>