<template>
  <div>
    <span>{{ title }}</span>
    <template v-if="showList.indexOf(prop) !== -1">
      <el-dropdown size="small" :class="{ 'float_right' : title !== '' }">
        <div class="el-dropdown-link">
          <i class="el-icon-arrow-down el-icon--right"></i>
        </div>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item v-for="item in dropdown[type]" @click.native="handleClick(item)">
            <i :class="item.icon"></i>
            <span>{{ item.label }}</span>
          </el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </template>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: ''
    },
    prop: {
      type: String,
      default: null
    },
    projectId: {
      // type: Number,
      default: null
    }
  },
  data() {
    return {
      type: 1,
      dropdown: [[
        {
          label: '最旧 -> 最新',
          value: 'asc',
          icon: 'el-icon-top'
        },
        {
          label: '最新 -> 最旧',
          value: 'desc',
          icon: 'el-icon-bottom'
        },
      ], [
        {
          label: 'A -> Z',
          value: 'asc',
          icon: 'el-icon-top'
        },
        {
          label: 'Z -> A',
          value: 'desc',
          icon: 'el-icon-bottom'
        },
      ], [
        {
          label: '0 -> 9',
          value: 'asc',
          icon: 'el-icon-top'
        },
        {
          label: '9 -> 0',
          value: 'desc',
          icon: 'el-icon-bottom'
        },
      ]],
      showList: [
        'id',
        'publicAccreditDate',
        'publicDate',
        'applicationDate',
        'rightNum',
        'quoteNum',
        'quotedNum',
        'name',
        'patentNo',
        'applicationNo',
        '',
        '',
      ]
    }
  },
  mounted() {
    if (['id', 'publicAccreditDate', 'publicDate', 'applicationDate'].indexOf(this.prop) !== -1) {
      this.type = 0
    }
    if (['rightNum', 'quoteNum', 'quotedNum'].indexOf(this.prop) !== -1) {
      this.type = 2
    }
    if(!this.projectId){
      this.showList= [
        'publicAccreditDate',
        'publicDate',
        'applicationDate',
      ]
    }
  },
  methods: {
    handleClick(item) {
      this.$emit('on-sort', {
        prop: this.prop,
        order: item.value
      })
    }
  }
}
</script>

<style lang="scss">

</style>