<template>
  <div class="flex-count">
    <div class="flex-num">
      <div class="time-title">已选（{{ num }}）项</div>
      <div v-if="exportStatusList" class="flex-time">
        <div class="time-title">时间:</div>
        <el-date-picker
          v-model="seachList"
          type="daterange"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"
          :default-time="['00:00:00', '23:59:59']"
        >
        </el-date-picker>
        <el-button type="primary" size="small" @click="clickSeach" plain
          >搜索</el-button
        >
      </div>
    </div>
    <div class="flex-num" v-if="exportStatusList">
      <!-- <el-button
        type="primary"
        @click="clickApproval"
        v-if="approvalStatus"
        plain
        >批量审批</el-button
      > -->
      <el-button type="primary" @click="clickExport" v-if="exportStatus" plain
        >批量导出</el-button
      >
    </div>
  </div>
</template>

<script>
export default {
  props: {
    num: {
      type: Number,
      default: () => [],
    },
    exportStatusList: {
      type: Boolean,
      default: () => [],
    },
  },
  data() {
    return {
      seachList: "",
      approvalStatus: true,
      exportStatus: true,
    };
  },
  methods: {
    clickExport() {
      if (this.approvalStatus) {
        this.approvalStatus = false;
        this.$emit("clickexport", true);
      } else {
        this.$emit("export", true);
      }
    },
    clickApproval() {
      this.$emit("clickApproval", true);
    },
    clickSeach() {
      this.$emit("seachExportList", this.seachList);
    },
  },
  created() {},
};
</script>

<style lang="scss" scoped>
.time-title {
  margin-right: 20px;
  height: 40px;
  line-height: 40px;
}
.flex-count {
  display: flex;
  justify-content: space-between;
  .flex-num {
    margin: 1%;
    display: flex;
    .flex-time {
      display: flex;
      margin-left: 20px;
      margin-right: 20px;
    }
  }
}
</style>
