<template>
  <Select
    ref="select"
    v-bind="$attrs"
    :value="strValue"
    :parentVal="parentVal"
    :code="code"
    transfer
    v-on="$listeners"
    @input="handleInput"
  >
    <Option
      v-for="item in dataList"
      :key="item.value + item.label"
      :value="item.value"
    >
      {{ item.label }}
    </Option>
  </Select>
</template>
<script>
/**
 * 反显值集信息下拉框组件
 * 该组件需要返回数据严格为：[{label: 'xxx', value: 'xxx'}]格式
 * 其它props和event请参考iview select组件
 */
import Server from './server.js';
const server = new Server();
export default {
  name: 'DataSelect',
  components: {},
  directives: {},
  props: {
    value: {
      type: [String, Array],
      default() {
        return '';
      }
    },
    datas: {
      type: Array,
      default() {
        return [];
      }
    },
    // 值集code
    code: {
      type: String,
      default() {
        return '';
      }
    },
    // 父值集value
    parentVal: {
      type: String,
      default() {
        return '';
      }
    },
    filterValue: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  data() {
    return {
      server: server,
      dataList: [],
      dataMap: {}
    };
  },
  computed: {
    strValue() {
      if (this.value instanceof Array) {
        return this.value;
      } else {
        return '' + this.value;
      }
    }
  },
  watch: {
    datas: function(newVal, oldVal) {
      this.dataList = newVal;
    },
    dataList: function(newVal, oldVal) {
      this.dataMap = {};
      for (const item of this.dataList) {
        this.dataMap[item.value] = item.label;
      }
      this.loadFinish();
    },
    parentVal: function(newVal, oldVal) {
      this.$refs.select.clearSingleSelect();
      this.loadData();
    },
    value: function(newVal, oldVal) {
      this.$emit('input', newVal);
    }
  },
  created: function() {
    if (!sessionStorage.getItem('valueSet')) {
      sessionStorage.setItem('valueSet', JSON.stringify({}));
    }
  },
  beforeMount: function() {},
  mounted: function() {
    this.loadData();
  },
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: {
    handleInput(value) {
      this.$emit('input', value);
      this.$emit('dataSelectChange', value, this.dataMap[value]);
    },
    loadData() {
      const valueSet = JSON.parse(sessionStorage.getItem('valueSet'));
      if (!this.code) {
        this.dataList = this.datas;
      } else if (
        this.parentVal !== '' &&
        this.parentVal !== null &&
        this.parentVal !== undefined &&
        this.code
      ) {
        if (
          valueSet[
            this.parentVal + '$' + this.code + this.filterValue.join('-')
          ]
        ) {
          this.dataList =
            valueSet[
              this.parentVal + '$' + this.code + this.filterValue.join('-')
            ];
          this.filterOptions();
          return;
        }
        this.server
          .queryValueSetByCodeAndParentKey({
            parentKey: this.parentVal,
            code: this.code
          })
          .then(response => {
            if (response.statusCode != '-1') {
              this.dataList = response;
              this.filterOptions();
            } else {
              this.$Message.error('查询值集失败');
            }
          });
        // }else if(this.parentVal !== "" && this.parentVal !== null && this.parentVal !== undefined && this.code) {
      } else if (!this.parentVal && this.code + this.filterValue.join('-')) {
        if (
          valueSet[
            this.parentVal + '$' + this.code + this.filterValue.join('-')
          ]
        ) {
          this.dataList =
            valueSet[
              this.parentVal + '$' + this.code + this.filterValue.join('-')
            ];
          this.filterOptions();
          return;
        }
        this.server
          .queryValueSetByCode({
            code: this.code
          })
          .then(response => {
            if (response.statusCode != '-1') {
              this.dataList = response;
              this.filterOptions();
            } else {
              this.$Message.error('查询值集失败');
            }
          });
      }
    },
    loadFinish() {
      const valueSet = JSON.parse(sessionStorage.getItem('valueSet'));
      this.$emit('loadFinish', {
        valueList: this.dataList,
        valueMap: this.dataMap
      });
      if (this.dataList && this.dataList.length > 0) {
        valueSet[
          this.parentVal + '$' + this.code + this.filterValue.join('-')
        ] = this.dataList;
        sessionStorage.setItem('valueSet', JSON.stringify(valueSet));
      }
    },
    filterOptions() {
      if (this.filterValue.length != 0) {
        console.log(this.dataList);
        for (let i = 0; i < this.filterValue.length; i++) {
          for (let j = 0; j < this.dataList.length; j++) {
            console.log(this.filterValue[i], this.dataList[j].value);
            if (this.filterValue[i] == this.dataList[j].value) {
              this.dataList.splice(j, 1);
              break;
            }
          }
        }
      }
    }
  }
};
</script>
