<template>
  <div class="d-flex flex-wrap pb-3">
    <div>
      <a-input placeholder="揭榜人" style="width: 150px" v-model="accepterName" allow-clear />
      <span class="ml-3"> 揭榜状态:</span>
      <a-select @change="handleChangeSelect" class="ml-3" style="width: 150px" placeholder="状态" allow-clear>
        <a-select-option :key="item" :value="index" v-for="(item, index) in statusList">{{ item }}</a-select-option>
      </a-select>

      <a-button @click="handleTableChange" class="mx-2" type="primary">搜索</a-button>
    </div>

    <div class="flex-1"></div>
  </div>
</template>

<script>
export default {
  name: 'UnveSearch',
  data() {
    return {
      visible: false,
      title: '',
      statusList: ['待审核', '成功', '未成功'],
      orderStatus: '',
      accepterName: '',
    };
  },
  methods: {
    handleChangeSelect(e) {
      this.orderStatus = e;
    },
    handleTableChange() {
      const { orderStatus, accepterName } = this;
      // 传参
      const condition = { orderStatus, accepterName };
      this.$emit('getData', condition);
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="stylus"></style>
