<template>
  <Select
    v-model="sels"
    style="width:150px"
    @on-change="onchange"
    clearable
    :multiple="isMulti"
    :placeholder="placeHolder"
  >
    <Option v-for="item in datasource" :value="item.value" :key="item.value">{{ item.label }}</Option>
  </Select>
</template>
<script>
import { refQuery } from "@/api/meta";
export default {
  name: "remoteselects",
  components: {},
  model: {
    prop: "value",
    event: "change"
  },
  props: ["labelField","valueField","value","refModel","placeHolder","isMulti"],
  data() {
    return {
      sels: this.value? this.value:[],
      datasource: []
    };
  },
  watch: {
    value(nv, ov) {
      this.sels = nv;
    }
  },
  methods: {
    onchange(v) {
      console.log("=============", v);
      this.$emit("change", this.sels);
    },
    initDataSource(slike) {
      // this.datasource=[]
      let query = {};
      let url = "/web/common/" + this.refModel + "Ctl/refQuery";
      query.fields = [this.labelField, this.valueField];
      query.likestr = slike;
      query.refwhere = this.refwhere ? this.refwhere : {};
      refQuery(url, query).then(r => {
        if(r.data){
          this.datasource=r.data;
        }
      });
    }
  },
  created() {
    this.initDataSource();
  },
  mounted() {}
};
</script>

<style>
</style>
