<template>
  <!-- 反馈批次下拉框 -->
  <div>
    <base-select v-model="currentValue"
               v-if="!disabled"
               :clearable="clearable"
               :filterable="filterable "
               :multiple="multiple"
               :api="api"
               :options.sync="options"
               :queryParas="queryParasValue"
               :collapsetags="collapsetags"
               :disabled="disabled"
               :reload="reload"
               :width="width"
               :selectedField="selectedField"
               @loaded="loaded"
               :placeholder="placeholder"
               @select-changed="selectChanged"
               no-data-text="数据加载中或加载失败">
    </base-select>
     <!-- 查看 -->
    <el-input v-if="disabled" :disabled="disabled" v-model="checkValue"></el-input>
  </div>
</template>

<script>
import componentsApi from '@/api/assetoutfeedback/componentsApi'
import components from 'newepoch-components'
export default {
  name: 'feedBackFreqSelectList',
  components: {
    BaseSelect: components.BaseSelect
  },
  props: {
    // v-model绑定的数据
    value: {
      type: [Array, String, Number],
      default: function () {
        return null
      }
    },
    // 是否禁用修改
    disabled: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    width: {
      type: String,
      default: function () {
        return ''
      }
    },
    // 是否可多选
    multiple: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 重新加载数据（每次取非即可）
    reload: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 是否可搜索
    filterable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    // 是否可清除
    clearable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    // 多选折叠
    collapsetags: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 默认提示语
    placeholder: {
      type: String,
      default: function () {
        return '请选择'
      }
    },
    name: {
      type: String,
      default: 'feedBackFreq',
      require: false
    },
    // 列表请求参数
    queryParas: {
      type: Object,
      default: function () {
        return {}
      }
    },
    // 反馈文件类型
    auditFileType: {
      type: [Array, String],
      default: function () {
        return []
      }
    }
  },
  data () {
    return {
      // 下拉列表数据
      'options': [],
      // 自定义键名
      selectedField: ['feedbackFrequency', 'feedbackFrequencyShow'],
      defaultQueryParas: {
        auditFileType: typeof this.auditFileType === 'string' ? [this.auditFileType] : this.auditFileType
      },
      // 列表请求参数
      queryParasValue: Object.assign({}, {
        auditFileType: typeof this.auditFileType === 'string' ? [this.auditFileType] : this.auditFileType
      }, this.queryParas)
    }
  },
  mounted () {
    let $this = this
    if (this.disabled) {
      $this.api['getList'](this.queryParasValue).then(res => {
        if (res && res.success && res.data) {
          this.options = res.data
        }
      })
    }
  },
  watch: {
    queryParas: {
      deep: true,
      immediate: true,
      handler (newVal, oldVal) {
        // console.log(newVal)
        if (oldVal && ((newVal.projectId && newVal.projectId !== oldVal.projectId) || (newVal.periods && newVal.periods !== oldVal.periods) || (newVal.auditFileType && newVal.auditFileType !== oldVal.auditFileType))) {
          this.queryParasValue = Object.assign({}, this.defaultQueryParas, newVal)
        }
      }
    },
    auditFileType (e) {
      if (e.length > 0) {
        this.queryParasValue = Object.assign({}, this.queryParas, { auditFileType: typeof e === 'string' ? [e] : e })
      }
    }
  },
  computed: {
    // 转换绑定的选中数据，与v-model同步
    currentValue: {
      get: function () {
        return this.value > 0 ? this.value : this.multiple ? [] : ''
      },
      set: function (value) {
        this.$emit('input', value > 0 ? value : this.multiple ? [] : '')
      }
    },
    api () {
      // 若产品,期数,文件类型没有则不请求
      return this.queryParasValue.projectId && this.queryParasValue.periods && ((this.auditFileType && this.auditFileType.length > 0) || (this.queryParasValue.auditFileType && this.queryParasValue.auditFileType.length > 0)) ? componentsApi.freqList : null
    },
    checkValue () {
      return this.options.length > 0 ? this.options.filter(item => {
        return item.feedbackFrequency === this.currentValue
      })[0].feedbackFrequencyShow : ''
    }
  },
  methods: {
    selectChanged (val, row) {
      this.$emit('selectChanged', val, this.name, row)
    },
    loaded (val) {
      let $this = this
      let selectItemts = null
      if (val.length > 0) {
        if (!this.multiple) {
          selectItemts = val.find(it => {
            return $this.currentValue === it[$this.selectedField[0]]
          })
        } else {
          selectItemts = val.filter(it => {
            var isTrue = false
            $this.currentValue.forEach(kit => {
              if (kit === it[$this.selectedField[0]]) {
                isTrue = true
              }
            })
            return isTrue
          })
        }
        this.$emit('selectChanged', '', this.name, selectItemts)
      }
    }
  }
}
</script>
