<template>
  <div class="allSelect">
    <el-form-item label="归属企业" prop="">
      <el-select :class="multiple ? 'multiple' : ''" :multiple="multiple" @change="onChange(item)" v-model="productagentsid" clearable>
        <el-option v-for="(item, index) of dlsStoreData" :key="index" :label="item.agentsname" :value="item.agentsid"> {{ item.agentsname }} - {{ item.agentsqym }} </el-option>
      </el-select>
    </el-form-item>
  </div>
</template>

<script>
import useAppStore from '@store/modules/app'

export default {
  data() {
    return {
      productagentsid: null,
      activeData: {},
      dlsStoreData: []
    }
  },
  props: {
    // 按钮类别
    buttonType: {
      type: Array,
      default: () => {
        // 'add' 新增, 'delete' 删除/作废, 'query' 查询, 'refresh' 刷新, 'export' 导出, 'reset' 重置
        // eg :buttonType="['add', 'delete', 'query', 'refresh', 'export', 'reset']"
        return ['query', 'refresh', 'reset']
      }
    },

    // lab选项卡
    activeId: '',
    // 多选
    multiple: {
      type: Boolean,
      default: true
    }
  },
  watch: {
    // activeId: (data) => {
    //   this.productagentsid = this.activeId.split(',')
    // }
  },
  created() {},
  mounted() {
    setTimeout(() => {
      if (this.activeId && this.multiple) {
        this.productagentsid = this.activeId.split(',')
      } else {
        this.productagentsid = this.activeId
      }
    }, 200)
    // 代理商数据
    this.dlsStoreData = useAppStore().dlsData
  },
  methods: {
    // 选项卡点击
    onChange(data) {
      let arr = ''
      if (Array.isArray(this.productagentsid)) {
        arr = this.productagentsid
      } else {
        arr = [this.productagentsid]
      }
      // 双数组遍历 终究无敌简洁优雅版
      let newparm = arr.map(
        (keyID) =>
          this.dlsStoreData.filter((value) => {
            if (keyID === value.agentsid) {
              return value
            }
          })[0]
      )
      // console.log(newparm, 'newparm')
      this.$emit('refreshButton', newparm)
    }
  }
}
</script>

<style lang="scss">
.multiple {
  .el-select__wrapper {
    padding: 10px 10px 10px 20px !important;
  }
}
</style>
